/*
Theme Name: Colorado Pilots Association
Theme URI: https://coloradopilots.org
Author: Brian Garrett
Description: Custom WordPress theme for the Colorado Pilots Association — The Voice of General Aviation in Colorado.
Version: 1.0.0
License: GNU General Public License v2 or later
Text Domain: cpa
*/

/* ═══════════════════════════════════════════════
   DESIGN SYSTEM
   ═══════════════════════════════════════════════ */

:root {
  /* Brand Colors */
  --color-primary:       #1E3A7B;
  --color-primary-light: #2E5CAD;
  --color-primary-dark:  #142954;
  --color-red:           #C8102E;
  --color-gold:          #FFD100;
  --color-gold-dark:     #E6BC00;

  /* Neutrals */
  --color-white:         #FFFFFF;
  --color-bg:            #F0F5FA;
  --color-bg-alt:        #E8EEF5;
  --color-border:        #D0D8E4;
  --color-dark:          #1A1A2E;
  --color-text:          #2a2a2a;
  --color-text-light:    #555555;

  /* Typography */
  --font-body:           'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-heading:        'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;

  /* Spacing */
  --space-xs:  0.25rem;
  --space-sm:  0.5rem;
  --space-md:  1rem;
  --space-lg:  2rem;
  --space-xl:  3rem;
  --space-2xl: 5rem;

  /* Layout */
  --content-width:     800px;
  --wide-width:        1200px;
  --site-width:        1400px;

  /* Borders & Shadows */
  --radius-sm: 4px;
  --radius-md: 8px;
  --shadow-sm: 0 1px 3px rgba(0,0,0,0.1);
  --shadow-md: 0 4px 12px rgba(0,0,0,0.1);
  --shadow-lg: 0 8px 24px rgba(0,0,0,0.12);

  /* Transitions */
  --transition: 0.2s ease;
}

/* ═══════════════════ Dark Mode ═══════════════════ */
[data-theme="dark"] {
  --color-primary:       #4A7FD4;
  --color-primary-light: #6B9BE8;
  --color-primary-dark:  #2E5CAD;
  --color-white:         #1A1D23;
  --color-bg:            #12151A;
  --color-bg-alt:        #1E2028;
  --color-border:        #2D3140;
  --color-dark:          #E8ECF0;
  --color-text:          #D4D8E0;
  --color-text-light:    #9CA3AF;
  --color-gold:          #FFD100;
  --shadow-sm: 0 1px 3px rgba(0,0,0,0.4);
  --shadow-md: 0 4px 12px rgba(0,0,0,0.4);
  --shadow-lg: 0 8px 24px rgba(0,0,0,0.5);
}
[data-theme="dark"] body {
  background: var(--color-bg);
  color: var(--color-text);
}
[data-theme="dark"] .site-header,
[data-theme="dark"] .main-nav {
  background: #0D1017;
}
[data-theme="dark"] .utility-bar {
  background: #080A0F;
}

/* ── Member Bar (logged-in user nav) ── */
/* ── User Menu Dropdown (upper-right utility bar) ── */
.user-menu { position:relative; flex-shrink:0; }
.user-menu__toggle { display:flex; align-items:center; gap:0.35rem; background:rgba(255,255,255,0.08); border:1px solid rgba(255,255,255,0.15); border-radius:5px; padding:0.3rem 0.6rem; color:#fff; font-size:0.8rem; font-weight:600; cursor:pointer; transition:background 0.15s; white-space:nowrap; }
.user-menu__toggle:hover { background:rgba(255,255,255,0.15); }
.user-menu__caret { transition:transform 0.2s; }
.user-menu__toggle[aria-expanded="true"] .user-menu__caret { transform:rotate(180deg); }
.user-menu__dropdown { position:absolute; right:0; top:calc(100% + 6px); background:#fff; border:1px solid #e2e8f0; border-radius:8px; box-shadow:0 8px 24px rgba(0,0,0,0.18); min-width:200px; z-index:9999; padding:0.3rem 0; max-height:80vh; overflow-y:auto; }
.user-menu__item { display:block; padding:0.4rem 1rem; font-size:0.82rem; color:#2d3748; text-decoration:none; font-weight:500; transition:background 0.1s; }
.user-menu__item:hover { background:#f7fafc; color:#1E3A7B; }
.user-menu__item.active { background:#e8f0fe; color:#1E3A7B; font-weight:700; }
.user-menu__item--view.active { border-left:3px solid #1E3A7B; padding-left:calc(1rem - 3px); }
.user-menu__item--chair { font-size:0.78rem; padding-left:1.5rem; }
.user-menu__item--chair.active { border-left:3px solid #b8860b; padding-left:calc(1.5rem - 3px); background:#fef8ee; color:#92400e; }
.user-menu__item--logout { color:#c0392b; }
.user-menu__item--logout:hover { background:#fdecea; }
.user-menu__divider { height:1px; background:#e2e8f0; margin:0.3rem 0; }
.user-menu__section { font-size:0.68rem; font-weight:700; text-transform:uppercase; letter-spacing:0.04em; color:#888; padding:0.4rem 1rem 0.15rem; }
.user-menu__login { color:#f6ad55; font-size:0.8rem; font-weight:700; text-decoration:none; padding:0.3rem 0.6rem; border:1px solid rgba(246,173,85,0.4); border-radius:5px; transition:background 0.15s; white-space:nowrap; }
.user-menu__login:hover { background:rgba(246,173,85,0.1); }
[data-theme="dark"] .user-menu__dropdown { background:#1a1d23; border-color:#2d3748; }
[data-theme="dark"] .user-menu__item { color:#e2e8f0; }
[data-theme="dark"] .user-menu__item:hover { background:#2d3748; color:#fff; }
[data-theme="dark"] .user-menu__item.active { background:#1e293b; }
[data-theme="dark"] .user-menu__divider { background:#2d3748; }
[data-theme="dark"] .user-menu__section { color:#64748b; }
[data-theme="dark"] .logo-bar {
  background: #12151A;
  border-bottom-color: var(--color-border);
}
[data-theme="dark"] .logo-bar .custom-logo-link img {
  /* Logo JPEG carries a baked-in white background, which reads as a hard-edged
     rectangle on the dark header. Same plate treatment as the footer. */
  padding: 10px;
  background: #fff;
  border-radius: 8px;
}
[data-theme="dark"] .site-footer {
  background: #0D1017;
}
[data-theme="dark"] .footer-main {
  background: #0D1017;
}
[data-theme="dark"] .footer-bottom {
  background: #080A0F;
}
[data-theme="dark"] a {
  color: var(--color-primary-light);
}
[data-theme="dark"] .page-content,
[data-theme="dark"] .entry-content {
  color: var(--color-text);
}
[data-theme="dark"] .content-card,
[data-theme="dark"] .event-card,
[data-theme="dark"] .home-news-item,
[data-theme="dark"] .home-media-card {
  background: var(--color-bg-alt);
  border-color: var(--color-border);
}
[data-theme="dark"] .event-detail-box {
  background: var(--color-bg-alt);
  border-color: var(--color-border);
}
[data-theme="dark"] .btn-outline {
  border-color: var(--color-border);
  color: var(--color-text);
}
[data-theme="dark"] .btn-outline:hover {
  border-color: var(--color-primary-light);
  color: var(--color-primary-light);
}
[data-theme="dark"] input,
[data-theme="dark"] select,
[data-theme="dark"] textarea {
  background: var(--color-bg-alt);
  border-color: var(--color-border);
  color: var(--color-text);
}
[data-theme="dark"] .widget {
  background: var(--color-bg-alt);
  border-color: var(--color-border);
}
[data-theme="dark"] table th {
  background: var(--color-bg-alt);
}
[data-theme="dark"] table td {
  border-color: var(--color-border);
}
/* Dark mode toggle button */
.dark-mode-toggle {
  background: none;
  border: 1px solid rgba(255,255,255,0.2);
  border-radius: 4px;
  padding: 0.15rem 0.5rem;
  cursor: pointer;
  font-size: 0.75rem;
  color: rgba(255,255,255,0.7);
  transition: all 0.2s;
}
.dark-mode-toggle:hover {
  border-color: rgba(255,255,255,0.5);
  color: #fff;
}

/* ═══════════════════════════════════════════════
   RESET & BASE
   ═══════════════════════════════════════════════ */

*, *::before, *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html {
  font-size: 16px;
}

@media (prefers-reduced-motion: no-preference) {
  html {
    scroll-behavior: smooth;
    scroll-padding-top: 100px;
  }
}

body {
  font-family: var(--font-body);
  font-size: 1.0625rem;
  line-height: 1.7;
  color: var(--color-text);
  background: var(--color-white);
  -webkit-font-smoothing: antialiased;
  letter-spacing: -0.01em;
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--font-heading);
  font-weight: 700;
  color: var(--color-primary);
  line-height: 1.35;
  letter-spacing: -0.02em;
  margin-bottom: var(--space-md);
}

h1 { font-size: 2.25rem; }
h2 { font-size: 1.75rem; }
h3 { font-size: 1.375rem; }
h4 { font-size: 1.125rem; }

p {
  margin-bottom: var(--space-md);
}
.entry-content > p,
.event-content > p {
  max-width: 75ch;
}

a {
  color: var(--color-primary-light);
  text-decoration: none;
  transition: color var(--transition);
}
a:hover { color: var(--color-primary); }

img {
  max-width: 100%;
  height: auto;
  display: block;
}

ul, ol { margin-bottom: var(--space-md); padding-left: var(--space-lg); }

/* ═══════════════════════════════════════════════
   UTILITY CLASSES
   ═══════════════════════════════════════════════ */

.site-container {
  max-width: var(--site-width);
  margin: 0 auto;
  padding: 0 var(--space-md);
}

.content-width {
  max-width: var(--content-width);
  margin: 0 auto;
}

.wide-width {
  max-width: var(--wide-width);
  margin: 0 auto;
}

/* .screen-reader-text is WordPress core's name for this and was used in five
   places here while being defined in none, so that text was rendering on the
   page in plain sight. Aliased rather than renamed: WP core, widgets and
   plugins emit the class too, and it needs to work wherever it lands. */
.sr-only,
.screen-reader-text {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}

/* Colorado tri-stripe horizontal rule */
hr,
.tri-stripe {
  border: none;
  height: 4px;
  background: linear-gradient(
    to right,
    var(--color-primary) 30%,
    var(--color-white) 30%,
    var(--color-white) 35%,
    var(--color-red) 35%,
    var(--color-red) 65%,
    var(--color-white) 65%,
    var(--color-white) 70%,
    var(--color-gold) 70%
  );
  margin: var(--space-xl) 0;
}

/* ═══════════════════════════════════════════════
   BUTTONS
   ═══════════════════════════════════════════════ */

.btn {
  display: inline-block;
  padding: 0.75rem 1.75rem;
  font-family: var(--font-body);
  font-size: 1rem;
  font-weight: 600;
  text-decoration: none;
  border-radius: var(--radius-sm);
  border: 2px solid transparent;
  cursor: pointer;
  transition: all var(--transition);
  text-align: center;
}

.btn-gold {
  background: var(--color-gold);
  color: var(--color-dark);
  border-color: var(--color-gold);
}
.btn-gold:hover {
  background: var(--color-gold-dark);
  border-color: var(--color-gold-dark);
  color: var(--color-dark);
}

.btn-outline-white {
  background: transparent;
  color: var(--color-white);
  border-color: var(--color-white);
}
.btn-outline-white:hover {
  background: var(--color-white);
  color: var(--color-primary);
}

.btn-primary {
  background: var(--color-primary);
  color: var(--color-white);
  border-color: var(--color-primary);
}
.btn-primary:hover {
  background: var(--color-primary-dark);
  border-color: var(--color-primary-dark);
  color: var(--color-white);
}

.btn-outline-primary {
  background: transparent;
  color: var(--color-primary);
  border-color: var(--color-primary);
  padding: 0.5rem 1rem;
  font-size: 0.875rem;
}
.btn-outline-primary:hover {
  background: var(--color-primary);
  color: var(--color-white);
}

/* Jump Navigation */
.flyin-jump-nav {
    margin: var(--space-xl) 0 var(--space-lg);
}

.flyin-buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-top: var(--space-md);
}

.back-to-top {
    margin-top: var(--space-sm);
    margin-bottom: var(--space-lg);
    padding-top: var(--space-sm);
    border-top: 1px solid var(--color-border);
}

.back-to-top a {
    font-size: 0.875rem;
    font-weight: 600;
    color: var(--color-primary-light);
}

.back-to-top a:hover {
    color: var(--color-primary);
}

.text-center { text-align: center; }

/* Document Buttons */
.document-buttons {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0.75rem;
    margin-bottom: var(--space-lg);
}

.document-buttons br {
    display: none;
}

.document-btn {
    flex: 1 1 calc(33.333% - 0.75rem);
    min-width: 200px;
    text-align: center;
    padding: 1rem 1.5rem;
    font-size: 1.05rem;
    border-radius: var(--radius-md);
    box-shadow: 0 3px 6px rgba(0, 0, 0, 0.2);
}

.document-btn:hover {
    box-shadow: 0 5px 12px rgba(0, 0, 0, 0.3);
    transform: translateY(-2px);
}

/* ═══════════════════════════════════════════════
   FOOTER
   ═══════════════════════════════════════════════ */

.site-footer {
    margin-top: var(--space-2xl);
}

.footer-main {
    background: var(--color-dark);
    color: rgba(255,255,255,0.85);
    padding: var(--space-2xl) 0;
}

.footer-grid {
    display: grid;
    grid-template-columns: 1.2fr 1fr 1fr;
    gap: var(--space-xl);
}

.footer-logo img {
    max-height: 80px;
    width: auto;
    margin-bottom: var(--space-md);
    padding: 10px;
    /* Literal #fff, not var(--color-white) — that token flips to #1A1D23 in dark mode. */
    background: #fff;
    border-radius: 8px;
}

.footer-tagline {
    font-style: italic;
    color: rgba(255,255,255,0.7);
    margin-bottom: var(--space-md);
}

.footer-address {
    font-style: normal;
    line-height: 1.8;
    color: rgba(255,255,255,0.7);
}

.footer-heading {
    color: var(--color-white);
    font-size: 1.125rem;
    margin-bottom: var(--space-md);
    padding-bottom: var(--space-sm);
    border-bottom: 2px solid var(--color-gold);
    display: inline-block;
}

.footer-links {
    list-style: none;
    padding: 0;
    margin: 0;
}

.footer-links li {
    margin-bottom: var(--space-sm);
}

.footer-links a {
    color: rgba(255,255,255,0.8);
    transition: color var(--transition);
}

.footer-links a:hover {
    color: var(--color-gold);
}

.footer-social {
    display: flex;
    gap: var(--space-md);
    margin-bottom: var(--space-lg);
}

.footer-social a {
    color: rgba(255,255,255,0.7);
    transition: color var(--transition);
}

.footer-social a:hover {
    color: var(--color-gold);
}

.footer-bottom {
    background: #12121F;
    padding: var(--space-md) 0;
    font-size: 0.8125rem;
    color: rgba(255,255,255,0.5);
}

.footer-bottom-inner {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.footer-legal {
    display: flex;
    gap: var(--space-lg);
}

.footer-legal a {
    color: rgba(255,255,255,0.5);
}

.footer-legal a:hover {
    color: var(--color-gold);
}

/* ═══════════════════════════════════════════════
   PAGE LAYOUT
   ═══════════════════════════════════════════════ */

.page-layout {
    display: grid;
    grid-template-columns: 1fr 280px;
    gap: var(--space-xl);
    padding-top: var(--space-lg);
    padding-bottom: var(--space-2xl);
}

.page-layout .content-area {
    min-width: 0;
}

/* No sidebar fallback */
.page-layout:not(:has(.sidebar)) {
    grid-template-columns: 1fr;
}

.page-title {
    font-size: 2.25rem;
    margin-bottom: var(--space-lg);
    padding-bottom: var(--space-md);
    border-bottom: 3px solid var(--color-bg);
}

.entry-content {
    line-height: 1.75;
}
.entry-content table {
    display: block;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    max-width: 100%;
}
.entry-content thead,
.entry-content tbody,
.entry-content tr {
    display: revert;
}

.entry-content p:has(> img.alignright) {
    float: right;
    width: 45%;
    margin: 0 0 0 var(--space-lg);
}

.entry-content p:has(> img.alignright) img {
    width: 100%;
    max-width: none;
    height: auto;
    display: block;
}

.entry-content p:has(> img.alignright) + .image-caption {
    float: right;
    clear: right;
    width: 45%;
    margin: 0 0 var(--space-md) var(--space-lg);
    font-size: 0.875rem;
    color: var(--color-text-light);
    text-align: center;
}

.entry-content p:has(> img.alignleft) {
    float: left;
    max-width: 40%;
    margin: 0 var(--space-lg) var(--space-md) 0;
}

.entry-content p:has(> img.alignleft) img {
    width: 100%;
    height: auto;
    display: block;
}

.entry-content .alignright {
    float: right;
    max-width: 40%;
    height: auto;
    margin: 0 0 var(--space-md) var(--space-lg);
}

.entry-content .alignleft {
    float: left;
    max-width: 40%;
    height: auto;
    margin: 0 var(--space-lg) var(--space-md) 0;
}

.entry-content h2 { margin-top: var(--space-xl); }
.entry-content h3 { margin-top: var(--space-lg); }

.entry-content table {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: var(--space-lg);
}

.entry-content th,
.entry-content td {
    padding: 0.75rem 1rem;
    border: 1px solid var(--color-border);
    text-align: left;
}

.entry-content th {
    background: var(--color-primary);
    color: var(--color-white);
    font-weight: 600;
}

.entry-content tr:nth-child(even) {
    background: var(--color-bg);
}

/* Breadcrumbs */
.breadcrumbs {
    padding: var(--space-md) 0;
    font-size: 0.875rem;
    color: var(--color-text-light);
}

.breadcrumbs a {
    color: var(--color-primary-light);
}

.breadcrumbs .sep {
    margin: 0 0.375rem;
    color: var(--color-border);
}

.breadcrumbs .current {
    color: var(--color-text);
}

/* Post Meta */
.post-meta {
    font-size: 0.875rem;
    color: var(--color-text-light);
    margin-bottom: var(--space-lg);
}

.post-meta .author { margin-left: var(--space-md); }

/* Post Card */
.post-card {
    margin-bottom: var(--space-xl);
    padding-bottom: var(--space-xl);
    border-bottom: 1px solid var(--color-border);
}

.post-card h2 a {
    color: var(--color-primary);
}

.post-card h2 a:hover {
    color: var(--color-primary-light);
}

/* Search */
.search-form {
    display: flex;
    gap: var(--space-sm);
    max-width: 500px;
}

.search-input {
    flex: 1;
    padding: 0.75rem 1rem;
    border: 2px solid var(--color-border);
    border-radius: var(--radius-sm);
    font-family: var(--font-body);
    font-size: 1rem;
}

.search-input:focus {
    border-color: var(--color-primary-light);
    outline: none;
}

.search-result {
    margin-bottom: var(--space-lg);
    padding-bottom: var(--space-lg);
    border-bottom: 1px solid var(--color-border);
}

/* Sidebar */
.sidebar {
    font-size: 0.9375rem;
}

.sidebar .widget {
    margin-bottom: var(--space-xl);
    padding: var(--space-lg);
    background: var(--color-bg);
    border-radius: var(--radius-md);
}

.sidebar .widget-title {
    font-size: 1rem;
    margin-bottom: var(--space-md);
    padding-bottom: var(--space-sm);
    border-bottom: 2px solid var(--color-primary);
}

/* 404 */
.error-404 {
    text-align: center;
    padding: var(--space-2xl) 0;
}

/* ═══════════════════════════════════════════════
   HERO CAROUSEL
   ═══════════════════════════════════════════════ */

.hero-carousel {
    position: relative;
    overflow: hidden;
    height: 500px;
}

.carousel-slide {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center;
    opacity: 0;
    transition: opacity 0.8s ease;
}

.carousel-slide.active {
    opacity: 1;
}

.carousel-overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(to bottom, rgba(0,0,0,0.2), rgba(0,0,0,0.5));
    display: flex;
    align-items: center;
    justify-content: center;
}

.carousel-content {
    text-align: center;
    color: var(--color-white);
}

.carousel-tagline {
    font-size: 2rem;
    font-weight: 700;
    font-style: italic;
    margin-bottom: var(--space-lg);
    text-shadow: 0 2px 8px rgba(0,0,0,0.3);
}

.carousel-ctas {
    display: flex;
    gap: var(--space-md);
    justify-content: center;
}

.carousel-prev,
.carousel-next {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: rgba(0,0,0,0.4);
    color: white;
    border: none;
    padding: 0.75rem;
    cursor: pointer;
    border-radius: 50%;
    transition: background var(--transition);
    z-index: 10;
}

.carousel-prev:hover,
.carousel-next:hover {
    background: rgba(0,0,0,0.7);
}

.carousel-prev { left: var(--space-lg); }
.carousel-next { right: var(--space-lg); }

.carousel-dots {
    position: absolute;
    bottom: var(--space-lg);
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    gap: var(--space-sm);
    z-index: 10;
}

.carousel-dot {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    border: 2px solid var(--color-white);
    background: transparent;
    cursor: pointer;
    transition: background var(--transition);
}

.carousel-dot.active,
.carousel-dot:hover {
    background: var(--color-gold);
    border-color: var(--color-gold);
}

/* Cloud Divider */
.cloud-divider {
    margin-top: -2px;
    line-height: 0;
}

.cloud-divider img {
    width: 100%;
    height: auto;
}

/* ═══════════════════════════════════════════════
   HOMEPAGE SECTIONS
   ═══════════════════════════════════════════════ */

.home-section {
    padding: var(--space-xl) 0;
}

.section-title {
    text-align: center;
    font-size: 1.75rem;
    margin-bottom: var(--space-lg);
    position: relative;
}

.section-title::after {
    content: '';
    display: block;
    width: 60px;
    height: 3px;
    background: var(--color-gold);
    margin: var(--space-sm) auto 0;
}

.section-cta {
    text-align: center;
    margin-top: var(--space-lg);
}

/* Content Cards */
.cards-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--space-lg);
}

.content-card {
    background: var(--color-white);
    border-radius: var(--radius-md);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
    border: 1px solid var(--color-border);
    border-bottom: 4px solid var(--color-primary);
    transition: all var(--transition);
    overflow: hidden;
}

.content-card:hover {
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.2);
    transform: translateY(-4px);
}

.card-image {
    width: 100%;
    aspect-ratio: 16 / 9;
    overflow: hidden;
}

.card-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform var(--transition);
}

.content-card:hover .card-image img {
    transform: scale(1.05);
}

.card-body {
    padding: var(--space-lg);
}

.card-title {
    font-size: 1.25rem;
    margin-bottom: var(--space-sm);
}

.card-desc {
    color: var(--color-text-light);
    font-size: 0.9375rem;
    margin-bottom: var(--space-md);
}

.card-link {
    font-weight: 600;
    color: var(--color-primary-light);
}

.card-link:hover {
    color: var(--color-primary);
}

/* Events List */
.events-list {
    max-width: var(--content-width);
    margin: 0 auto;
}

.event-item {
    display: flex;
    gap: var(--space-lg);
    align-items: flex-start;
    padding: var(--space-md) 0;
    border-bottom: 1px solid var(--color-border);
}

.event-date-badge {
    display: flex;
    flex-direction: column;
    align-items: center;
    background: var(--color-white);
    border: 2px solid var(--color-gold);
    border-radius: var(--radius-sm);
    padding: var(--space-sm) var(--space-md);
    min-width: 60px;
}

.event-month {
    font-size: 0.75rem;
    font-weight: 700;
    text-transform: uppercase;
    color: var(--color-gold-dark);
}

.event-day {
    font-size: 1.5rem;
    font-weight: 800;
    color: var(--color-primary);
    line-height: 1;
}

.event-info h3 {
    font-size: 1.0625rem;
    margin-bottom: 0.25rem;
}

.event-info h3 a {
    color: var(--color-primary);
}

.event-venue {
    font-size: 0.875rem;
    color: var(--color-text-light);
    margin: 0;
}

/* Corporate Members */
.logo-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
    gap: var(--space-lg);
    align-items: center;
    justify-items: center;
}

.logo-item img {
    max-height: 60px;
    width: auto;
    filter: grayscale(100%);
    opacity: 0.7;
    transition: all var(--transition);
}

.logo-item:hover img {
    filter: grayscale(0);
    opacity: 1;
}

.logo-placeholder {
    font-size: 0.8125rem;
    color: var(--color-text-light);
    text-align: center;
}

/* Join CTA */
.join-cta {
    background: var(--color-primary);
    color: var(--color-white);
    text-align: center;
}

.join-cta h2 {
    color: var(--color-white);
    font-size: 2rem;
    margin-bottom: var(--space-md);
}

.join-cta p {
    max-width: 600px;
    margin: 0 auto var(--space-lg);
    color: rgba(255,255,255,0.85);
    font-size: 1.125rem;
}

/* ═══════════════════════════════════════════════
   PAGE TEMPLATE: FULL WIDTH
   ═══════════════════════════════════════════════ */

.page-layout-full {
    max-width: var(--wide-width);
    margin: 0 auto;
    padding: var(--space-lg) var(--space-md) var(--space-2xl);
}

/* ═══════════════════════════════════════════════
   PAGE TEMPLATE: VIDEO LIBRARY
   ═══════════════════════════════════════════════ */

.video-library .wp-block-embed {
    margin-bottom: var(--space-xl);
    padding-bottom: var(--space-xl);
    border-bottom: 1px solid var(--color-border);
}

.video-library .wp-block-columns {
    margin-bottom: var(--space-xl);
    padding-bottom: var(--space-xl);
    border-bottom: 1px solid var(--color-border);
}

/* ═══════════════════════════════════════════════
   PAGE TEMPLATE: FAQ
   ═══════════════════════════════════════════════ */

.faq-item {
    border: 1px solid var(--color-border);
    border-radius: var(--radius-md);
    margin-bottom: var(--space-sm);
    overflow: hidden;
}

.faq-question {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: var(--space-md) var(--space-lg);
    background: var(--color-primary);
    color: var(--color-white);
    cursor: pointer;
    font-weight: 600;
    transition: background var(--transition);
}

.faq-question:hover {
    background: var(--color-primary-dark);
}

.faq-question::after {
    content: '+';
    font-size: 1.5rem;
    font-weight: 300;
    transition: transform var(--transition);
}

.faq-item.open .faq-question::after {
    content: '−';
}

.faq-answer {
    display: none;
    padding: var(--space-lg);
    background: var(--color-white);
}

.faq-item.open .faq-answer {
    display: block;
}

/* ═══════════════════════════════════════════════
   PAGE TEMPLATE: ARCHIVE LIST
   ═══════════════════════════════════════════════ */

.archive-list h2 {
    color: var(--color-primary);
    border-bottom: 2px solid var(--color-gold);
    padding-bottom: var(--space-sm);
}

.archive-list .pdf-list {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-sm);
    list-style: none;
    padding: 0;
}

.archive-list .pdf-list a {
    display: inline-block;
    padding: 0.5rem 1rem;
    background: var(--color-primary);
    color: var(--color-white);
    border-radius: var(--radius-sm);
    font-size: 0.875rem;
    font-weight: 500;
    transition: background var(--transition);
}

.archive-list .pdf-list a:hover {
    background: var(--color-primary-light);
    color: var(--color-white);
}

/* ═══════════════════════════════════════════════
   PAGE TEMPLATE: LINKS DIRECTORY
   ═══════════════════════════════════════════════ */

.links-directory {
    column-count: 2;
    column-gap: var(--space-xl);
}

.links-directory h2 {
    column-span: all;
    font-size: 1.25rem;
    border-bottom: 2px solid var(--color-gold);
    padding-bottom: var(--space-sm);
    margin-top: var(--space-xl);
}

.links-directory h2:first-child {
    margin-top: 0;
}

.links-directory ul {
    break-inside: avoid;
}

/* Compass rose watermark on standard pages */
.page-content {
    position: relative;
}

.page-content::before {
    content: '';
    position: absolute;
    top: var(--space-xl);
    right: -60px;
    width: 300px;
    height: 300px;
    background: url('../images/compass-rose.svg') no-repeat center;
    background-size: contain;
    pointer-events: none;
    z-index: 0;
}

.page-content > * {
    position: relative;
    z-index: 1;
}

/* ═══════════════════════════════════════════════
   HOMEPAGE EVENTS & NEWS SIDE-BY-SIDE
   ═══════════════════════════════════════════════ */

.events-news-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--space-xl);
    align-items: start;
}

/* With METAR sidebar: main 2-col area + narrow weather sidebar */
.events-news-grid--with-sidebar {
    grid-template-columns: 1fr 280px;
    gap: var(--space-lg);
}

.events-news-main {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--space-xl);
    align-items: start;
}

.events-news-sidebar {
    position: sticky;
    top: 100px;
}

.events-news-col .section-title {
    text-align: left;
}

.events-news-col .section-title::after {
    margin-left: 0;
}

.events-news-col .section-cta {
    text-align: left;
}

/* News list items (side-by-side layout) */
.news-list {
    display: flex;
    flex-direction: column;
    gap: var(--space-md);
}

.news-list-item {
    display: flex;
    gap: var(--space-md);
    padding-bottom: var(--space-md);
    border-bottom: 1px solid var(--color-border);
}

.news-list-item:last-child {
    border-bottom: none;
    padding-bottom: 0;
}

.news-list-item__image {
    flex-shrink: 0;
    width: 80px;
    height: 80px;
    border-radius: var(--radius-sm);
    overflow: hidden;
}

.news-list-item__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.news-list-item__body {
    flex: 1;
    min-width: 0;
}

.news-list-item__date {
    display: block;
    font-size: 0.75rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--color-text-light);
    margin-bottom: 0.2rem;
}

.news-list-item__title {
    font-size: 0.95rem;
    line-height: 1.3;
    margin-bottom: 0.25rem;
}

.news-list-item__title a {
    color: var(--color-primary-dark);
}

.news-list-item__title a:hover {
    color: var(--color-primary);
}

.news-list-item__excerpt {
    font-size: 0.85rem;
    color: var(--color-text-light);
    line-height: 1.4;
    margin-bottom: 0;
}

@media (max-width: 1024px) {
    .events-news-grid--with-sidebar {
        grid-template-columns: 1fr;
    }

    .events-news-sidebar {
        position: static;
    }
}

@media (max-width: 768px) {
    .events-news-grid {
        grid-template-columns: 1fr;
        gap: var(--space-lg);
    }

    .events-news-main {
        grid-template-columns: 1fr;
    }

    .events-news-col .section-title {
        text-align: center;
    }

    .events-news-col .section-title::after {
        margin-left: auto;
    }

    .events-news-col .section-cta {
        text-align: center;
    }
}

/* ═══════════════════════════════════════════════
   EVENTS HERO
   ═══════════════════════════════════════════════ */

.events-hero {
  background: var(--color-primary);
  color: var(--color-white);
  text-align: center;
  padding: 0.75rem var(--space-md) 0.6rem;
}

.events-hero h1 {
  color: var(--color-white);
  font-size: 1.6rem;
  margin-bottom: 0.2rem;
}

.events-hero p {
  color: rgba(255,255,255,0.85);
  font-size: 0.92rem;
  max-width: 600px;
  margin: 0 auto;
  line-height: 1.4;
}

.btn--sm {
  padding: 0.5rem 1.25rem;
  font-size: 0.875rem;
}

.btn--lg {
  padding: 1rem 2.5rem;
  font-size: 1.125rem;
}

/* ═══════════════════════════════════════════════
   EVENTS TOOLBAR (FILTERS + ACTIONS)
   ═══════════════════════════════════════════════ */

.events-toolbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: var(--space-md);
  flex-wrap: wrap;
}

.events-filters {
  display: flex;
  gap: var(--space-sm);
}

.events-filters select {
  padding: 0.5rem 0.75rem;
  border: 2px solid var(--color-border);
  border-radius: var(--radius-sm);
  font-family: var(--font-body);
  font-size: 0.875rem;
  background: var(--color-white);
  cursor: pointer;
}

.events-filters select:focus {
  outline: none;
  border-color: var(--color-primary);
}

.events-actions {
  display: flex;
  gap: var(--space-sm);
}

/* ═══════════════════════════════════════════════
   EVENT TYPE BADGES (CPA)
   ═══════════════════════════════════════════════ */

.event-type-badge {
  display: inline-block;
  padding: 0.2rem 0.65rem;
  border-radius: 50px;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.02em;
}

.event-type--cpa          { background: #d0e8f2; color: #0c5460; }
.event-type--flyin        { background: #cce5ff; color: #004085; }
.event-type--lunchbunch   { background: #d4edda; color: #155724; }
.event-type--groundschool { background: #fff3cd; color: #856404; }
.event-type--safety       { background: #f8d7da; color: #721c24; }
.event-type--board        { background: #e8daef; color: #4a235a; }
.event-type--airshow      { background: #ffeaa7; color: #6c5200; }
.event-type--community    { background: #e2e3e5; color: #383d41; }
.event-type--aviation     { background: #dbeafe; color: #1e3a5f; }

/* ═══════════════════════════════════════════════
   EVENT CARDS
   ═══════════════════════════════════════════════ */

.events-list--cards {
  display: flex;
  flex-direction: column;
  gap: var(--space-md);
}

.events-month-group {
  margin-bottom: var(--space-lg);
}

.events-month-heading {
  font-size: 1.375rem;
  color: var(--color-primary);
  border-bottom: 2px solid var(--color-gold);
  padding-bottom: var(--space-sm);
  margin-bottom: var(--space-md);
}

.event-card {
  display: flex;
  gap: var(--space-sm);
  align-items: center;
  background: var(--color-white);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  padding: var(--space-sm) var(--space-md);
  transition: border-color .2s, box-shadow .2s;
}

.event-card:hover {
  border-color: var(--color-primary);
  box-shadow: var(--shadow-sm);
}

.event-card__date {
  flex-shrink: 0;
  width: 60px;
  text-align: center;
  background: var(--color-bg-alt);
  border-radius: var(--radius-md);
  padding: var(--space-xs) var(--space-xs);
}

.event-card__day {
  display: block;
  font-size: 1.75rem;
  font-weight: 900;
  font-family: var(--font-heading);
  color: var(--color-primary);
  line-height: 1.1;
}

.event-card__dow {
  display: block;
  font-size: 0.7rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--color-text-light);
}

/* The flyer or photo, between the date and the detail.
 *
 * A fixed width so a column of cards keeps one left edge for its text however
 * tall or wide the posters are — a flyer is portrait, a photograph landscape,
 * and letting either set the column makes the list stagger. object-fit keeps
 * both in the same frame without distorting them. */
.event-card__thumb {
  flex-shrink: 0;
  width: 64px;
  display: block;
  border-radius: var(--radius-md);
  overflow: hidden;
  line-height: 0;
}

.event-card__thumb img {
  width: 100%;
  height: 78px;
  object-fit: cover;
  object-position: top;   /* a flyer's title is at the top; never crop it away */
  display: block;
}

.event-card__body {
  flex: 1;
  min-width: 0;
}

.event-card__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-sm);
  margin-bottom: 0.15rem;
}

.event-card__time {
  font-size: 0.85rem;
  color: var(--color-text-light);
}

.event-card__title {
  font-size: 1.1rem;
  margin-bottom: 0.25rem;
}

.event-card__title a {
  color: var(--color-primary-dark);
}
.event-card__title a:hover {
  color: var(--color-primary);
}

.event-card__location {
  font-size: 0.9rem;
  color: var(--color-text-light);
  margin-bottom: 0.1rem;
}

.event-card__address {
  color: var(--color-text-light);
}

.event-card__virtual {
  display: inline-block;
  margin-left: var(--space-sm);
}

/* One line. This is a taster — the event's own page carries the description —
   and a long one ran to two or three lines and became the tallest thing on the
   card. Clamped rather than truncated in PHP so the full text is still in the
   markup for search and for a screen reader. */
.event-card__desc {
  font-size: 0.9rem;
  color: var(--color-text-light);
  margin-bottom: 0;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* Across, not stacked. Three buttons in a column stood 133px tall and set the
   height of most cards by itself, which is what made scrolling the list such a
   long journey. In a row they take one button's height and the card is free to
   be as tall as its words need. */
.event-card__actions {
  flex-shrink: 0;
  display: flex;
  flex-direction: row;
  align-items: center;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: var(--space-xs);
  align-self: center;
}

.event-card__price {
  font-weight: 700;
  color: var(--color-gold-dark);
}

/* Sits in front of the action column rather than after it. Trailing it left a
   line of small grey text hanging past the right edge of every button stack,
   so the cards no longer shared a right margin with anything else on the page.
   Centred against the buttons, and allowed to shrink to its own words. */
.event-card__rsvp {
  font-size: .8rem;
  color: var(--color-text-light);
  flex-shrink: 0;
  align-self: center;
  text-align: right;
  white-space: nowrap;
}

.event-card__rsvp--full {
  color: #856404;
  font-weight: 600;
}

/* ═══════════════════════════════════════════════
   CALENDAR ADD-TO / SUBSCRIBE
   ═══════════════════════════════════════════════ */

.cal-dropdown {
  position: relative;
}

.cal-dropdown__menu {
  display: none;
  position: absolute;
  right: 0;
  top: calc(100% + 4px);
  background: var(--color-white);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-lg);
  min-width: 200px;
  z-index: 50;
  padding: var(--space-xs) 0;
}

.cal-dropdown.is-open .cal-dropdown__menu {
  display: block;
}

.cal-dropdown__menu a {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  padding: 0.55rem 1rem;
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--color-text);
  transition: background .15s;
}

.cal-dropdown__menu a:hover {
  background: var(--color-bg-alt);
  color: var(--color-primary);
}

.cal-dropdown__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  border-radius: 4px;
  font-size: 0.7rem;
  font-weight: 900;
  color: var(--color-white);
  background: var(--color-primary);
  flex-shrink: 0;
}

/* Subscribe cards */
.events-subscribe-section {
  background: var(--color-primary);
  padding: var(--space-2xl) 0;
}

.cal-subscribe-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--space-md);
}

.cal-subscribe-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: var(--space-lg) var(--space-md);
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.15);
  border-radius: var(--radius-md);
  color: var(--color-white);
  transition: all .2s;
}

.cal-subscribe-card:hover {
  background: rgba(255,255,255,.14);
  border-color: rgba(255,255,255,.3);
  color: var(--color-white);
  transform: translateY(-3px);
}

.cal-subscribe-card__icon {
  width: 48px;
  height: 48px;
  border-radius: var(--radius-md);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.3rem;
  font-weight: 900;
  color: var(--color-white);
  margin-bottom: var(--space-sm);
}

.cal-subscribe-card h4 {
  color: var(--color-white);
  font-size: 1rem;
  margin-bottom: 0.25rem;
}

.cal-subscribe-card p {
  font-size: 0.82rem;
  opacity: .7;
  margin: 0;
}

.cal-feed-url {
  display: flex;
  max-width: 550px;
  margin: var(--space-xs) auto 0;
  gap: var(--space-xs);
}

.cal-feed-url input {
  flex: 1;
  padding: 0.5rem 0.75rem;
  font-family: var(--font-body);
  font-size: 0.8rem;
  border: 1px solid rgba(255,255,255,.25);
  border-radius: var(--radius-sm);
  background: rgba(255,255,255,.08);
  color: var(--color-white);
}

.cal-feed-url input:focus {
  outline: none;
  border-color: rgba(255,255,255,.5);
}

/* Single event page calendar buttons */
.cal-buttons-row {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-xs);
}

.cal-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.5rem 0.9rem;
  border: 2px solid var(--color-border);
  border-radius: var(--radius-sm);
  background: var(--color-white);
  color: var(--color-text);
  font-weight: 600;
  font-size: 0.82rem;
  transition: all .2s;
}

.cal-btn:hover {
  border-color: var(--color-primary);
  color: var(--color-primary);
}

.cal-btn__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  border-radius: 3px;
  font-size: 0.65rem;
  font-weight: 900;
  color: var(--color-white);
  flex-shrink: 0;
}

/* ═══════════════════════════════════════════════
   SINGLE EVENT DETAIL BOX
   ═══════════════════════════════════════════════ */

.event-detail-box {
  background: var(--color-bg-alt);
  border-radius: var(--radius-md);
  padding: var(--space-lg);
  border: 1px solid var(--color-border);
}

.event-detail-box--compact {
  padding: var(--space-md);
}

.event-detail-box__row {
  display: flex;
  align-items: flex-start;
  gap: var(--space-sm);
  padding: var(--space-sm) 0;
  border-bottom: 1px solid var(--color-border);
  font-size: 0.95rem;
}

.event-detail-box--compact .event-detail-box__row {
  padding: .35rem 0;
  border-bottom: none;
  align-items: center;
  font-size: 0.9rem;
}

.event-detail-box__row:last-of-type {
  border-bottom: none;
}

.event-detail-box__icon {
  font-size: 1.3rem;
  flex-shrink: 0;
  width: 28px;
  text-align: center;
}

.event-detail-box--compact .event-detail-box__icon {
  font-size: 1.1rem;
  width: 24px;
}

.event-detail-box__actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-sm);
  margin-top: var(--space-md);
  padding-top: var(--space-md);
  border-top: 1px solid var(--color-border);
}

.event-detail-box--compact .event-detail-box__actions {
  display: block;
  margin-top: 0;
  padding-top: 0;
}

/* ═══════════════════════════════════════════════
   RSVP SECTION
   ═══════════════════════════════════════════════ */

.event-rsvp {
  background: var(--color-bg-alt);
  border-radius: var(--radius-md);
  padding: var(--space-lg);
}

.event-rsvp__heading {
  font-size: 1.5rem;
  color: var(--color-primary);
  margin: 0 0 var(--space-sm);
}

.event-rsvp__capacity {
  font-size: .9rem;
  color: var(--color-text-light);
  margin-bottom: var(--space-md);
}

.event-rsvp__fields {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-sm);
  margin-bottom: var(--space-md);
}

.event-rsvp__field label {
  display: block;
  font-weight: 600;
  font-size: .85rem;
  margin-bottom: 4px;
}

.event-rsvp__field input,
.event-rsvp__field select {
  width: 100%;
  padding: 10px 12px;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  font-size: 1rem;
  font-family: inherit;
}

.event-rsvp__field input:focus,
.event-rsvp__field select:focus {
  outline: none;
  border-color: var(--color-primary);
  box-shadow: 0 0 0 3px rgba(30, 58, 123, .1);
}

.event-rsvp__submit {
  font-size: 1rem;
  padding: 12px 32px;
}

.event-rsvp__paid {
  text-align: center;
  padding: var(--space-md) 0;
}

.event-rsvp__price {
  font-size: 2rem;
  font-weight: 700;
  color: var(--color-gold-dark);
  margin-bottom: var(--space-sm);
}

.event-rsvp__notice {
  padding: var(--space-sm) var(--space-md);
  border-radius: 6px;
  font-size: .95rem;
  margin-bottom: var(--space-md);
}

.event-rsvp__notice--confirmed,
.event-rsvp__notice--promoted {
  background: #d4edda;
  color: #155724;
  border: 1px solid #c3e6cb;
}

.event-rsvp__notice--waitlisted {
  background: #fff3cd;
  color: #856404;
  border: 1px solid #ffeeba;
}

.event-rsvp__notice--cancel {
  background: #f8f9fa;
  color: var(--color-text);
  border: 1px solid var(--color-border);
}

/* ═══════════════════════════════════════════════
   MONTHLY CALENDAR GRID
   ═══════════════════════════════════════════════ */

.month-cal {
  background: var(--color-white);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  padding: var(--space-sm) var(--space-md);
  overflow: hidden;
  width: 100%;
}

.month-cal__header {
  display: flex;
  align-items: center;
  gap: var(--space-sm);
  margin-bottom: var(--space-sm);
}

.month-cal__title {
  font-size: 1.3rem;
  color: var(--color-primary);
  margin: 0;
  flex: 0 0 auto;
}

.month-cal__nav {
  background: none;
  border: 2px solid var(--color-border);
  border-radius: var(--radius-sm);
  width: 36px;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  font-size: 0.8rem;
  color: var(--color-primary);
  transition: all .15s;
}

.month-cal__nav:hover {
  border-color: var(--color-primary);
  background: var(--color-bg-alt);
}

.month-cal__today {
  margin-left: auto;
}

.month-cal__dow {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
  text-align: center;
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--color-text-light);
  padding-bottom: var(--space-xs);
  border-bottom: 1px solid var(--color-border);
  margin-bottom: 2px;
}

.month-cal__grid {
  display: grid;
  grid-template-columns: repeat(7, minmax(0, 1fr));
}

.month-cal__day {
  min-height: 80px;
  padding: 4px;
  border: 1px solid transparent;
  border-bottom: 1px solid var(--color-border);
  position: relative;
  transition: background .15s;
  overflow: hidden;
  min-width: 0;
}

.month-cal__day:hover {
  background: var(--color-bg);
}

.month-cal__day--outside {
  opacity: .3;
}

.month-cal__day--today {
  background: var(--color-bg-alt);
  border-radius: var(--radius-sm);
}

.month-cal__day-num {
  display: block;
  font-size: 0.85rem;
  font-weight: 700;
  color: var(--color-text-light);
  margin-bottom: 2px;
}

.month-cal__day--today .month-cal__day-num {
  color: var(--color-white);
  background: var(--color-primary);
  width: 24px;
  height: 24px;
  line-height: 24px;
  text-align: center;
  border-radius: 50%;
  font-size: 0.75rem;
}

/* Event pill inside a day cell */
.month-cal__event {
  display: block;
  font-size: 0.68rem;
  font-weight: 600;
  line-height: 1.2;
  padding: 2px 4px;
  margin-bottom: 1px;
  border-radius: 3px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  color: var(--color-white);
  text-decoration: none;
  transition: opacity .15s;
}

.month-cal__event:hover {
  opacity: .85;
  color: var(--color-white);
}

.month-cal__holiday {
  font-size: 0.6rem;
  font-weight: 600;
  color: #c0392b;
  padding: 1px 3px;
  margin-bottom: 1px;
  line-height: 1.2;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Event pill colors by type */
.month-cal__event--cpa          { background: #0c5460; }
.month-cal__event--flyin        { background: #004085; }
.month-cal__event--lunchbunch   { background: #28a745; }
.month-cal__event--groundschool { background: #c09000; }
.month-cal__event--safety       { background: #c8102e; }
.month-cal__event--board        { background: #6f42c1; }
.month-cal__event--airshow      { background: #6c5200; }
.month-cal__event--community    { background: #6c757d; }
.month-cal__event--aviation     { background: #1e3a5f; font-style: italic; opacity: 0.85; }
.month-cal__event--other        { background: var(--color-primary-light); }

.month-cal__more {
  display: block;
  font-size: 0.65rem;
  font-weight: 700;
  color: var(--color-primary);
  cursor: pointer;
  padding: 2px 4px;
  background: none;
  border: none;
  text-align: left;
}
.month-cal__more:hover {
  color: var(--color-primary-dark);
  text-decoration: underline;
}
.month-cal__less {
  color: var(--color-text-light);
  font-weight: 600;
}

/* ── Week View ── */
.month-cal__grid--week {
  grid-template-columns: repeat(7, minmax(0, 1fr));
}
.month-cal__day--week {
  min-height: 140px;
}
.month-cal__week-header {
  display: flex;
  align-items: baseline;
  gap: 0.3rem;
  margin-bottom: 4px;
  padding-bottom: 3px;
  border-bottom: 1px solid var(--color-border);
}
.month-cal__week-dayname {
  font-size: 0.7rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--color-text-light);
}
.month-cal__empty {
  font-size: 0.65rem;
  color: var(--color-text-light);
  font-style: italic;
  padding: 2px 4px;
}

/* ── Color Legend ── */
.month-cal__legend {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem 1rem;
  padding: var(--space-xs) var(--space-xs) 0;
  margin-top: var(--space-xs);
  border-top: 1px solid var(--color-border);
}
.month-cal__legend-item {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  font-size: 0.7rem;
  color: var(--color-text-light);
}
.month-cal__legend-swatch {
  display: inline-block;
  width: 12px;
  height: 12px;
  border-radius: 3px;
}

/* ═══════════════════════════════════════════════
   EVENT CARD RESPONSIVE
   ═══════════════════════════════════════════════ */

@media (max-width: 640px) {
  .event-card {
    flex-direction: column;
  }
  .event-card__date {
    width: auto;
    display: flex;
    gap: var(--space-xs);
    align-items: baseline;
    padding: var(--space-xs) var(--space-sm);
  }
  .event-card__day { font-size: 1.3rem; }
  /* Stacked on a phone, the poster spans the card rather than sitting in a
     narrow column that would leave it postage-stamp sized. */
  .event-card__thumb {
    width: 100%;
  }
  .event-card__thumb img {
    height: 160px;
  }
  .event-card__actions {
    flex-direction: row;
    align-self: flex-start;
  }
  /* Stacked on a phone there is no column to sit beside, so it reads as a
     line above the buttons rather than being pushed to one edge. */
  .event-card__rsvp {
    align-self: flex-start;
    text-align: left;
  }
  .events-toolbar {
    flex-direction: column;
    align-items: flex-start;
  }
  .cal-buttons-row {
    flex-direction: column;
  }
  .cal-feed-url {
    flex-direction: column;
  }
  .cal-subscribe-grid {
    grid-template-columns: 1fr 1fr;
  }
  .cal-subscribe-card {
    padding: var(--space-md);
  }
  .event-rsvp__fields {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 480px) {
  .cal-subscribe-grid {
    grid-template-columns: 1fr;
  }
}

/* Calendar grid responsive */
@media (max-width: 768px) {
  .month-cal {
    padding: var(--space-sm);
  }
  .month-cal__day {
    min-height: 56px;
    padding: 2px;
  }
  .month-cal__event {
    font-size: 0;
    height: 6px;
    border-radius: 3px;
    margin-bottom: 2px;
    padding: 0;
  }
  .month-cal__day-num {
    font-size: 0.75rem;
  }
  .month-cal__more {
    font-size: 0;
    display: none;
  }
  .month-cal__header {
    flex-wrap: wrap;
  }
  .month-cal__grid--week {
    grid-template-columns: 1fr;
  }
  .month-cal__day--week {
    min-height: auto;
    padding: var(--space-xs) var(--space-sm);
  }
  .month-cal__day--week .month-cal__event {
    font-size: 0.72rem;
    height: auto;
    padding: 2px 6px;
  }
  .month-cal__legend {
    gap: 0.4rem 0.8rem;
  }
  .events-hero h1 { font-size: 1.75rem; }
}

@media (max-width: 480px) {
  .month-cal__dow span {
    font-size: 0.65rem;
  }
  .month-cal__day {
    min-height: 40px;
  }
}

/* ═══════════════════════════════════════════════
   CLASSIFIED ADS
   ═══════════════════════════════════════════════ */

.classifieds-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--space-lg);
}

.classified-card {
  background: var(--color-white);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  overflow: hidden;
  transition: border-color .2s, box-shadow .2s;
}

.classified-card:hover {
  border-color: var(--color-primary);
  box-shadow: var(--shadow-sm);
}

.classified-card__image {
  display: block;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  background: var(--color-bg);
}

.classified-card__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform .3s;
}

.classified-card:hover .classified-card__image img {
  transform: scale(1.03);
}

.classified-card__body {
  padding: var(--space-md);
}

.classified-card__category {
  display: inline-block;
  padding: 0.15rem 0.55rem;
  border-radius: 50px;
  font-size: 0.72rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  background: #d0e8f2;
  color: #0c5460;
  margin-bottom: var(--space-sm);
}

.classified-card__title {
  font-size: 1.05rem;
  margin-bottom: var(--space-xs);
}

.classified-card__title a {
  color: var(--color-primary-dark);
}

.classified-card__title a:hover {
  color: var(--color-primary);
}

.classified-card__excerpt {
  font-size: 0.875rem;
  color: var(--color-text-light);
  margin-bottom: var(--space-sm);
  line-height: 1.4;
}

.classified-card__footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-top: var(--space-sm);
  border-top: 1px solid var(--color-border);
}

.classified-card__price {
  font-weight: 700;
  color: var(--color-gold-dark);
  font-size: 1rem;
}

.classified-card__date {
  font-size: 0.8rem;
  color: var(--color-text-light);
}

.classified-cat--airplanes-for-sale-or-buy { background: #cce5ff; color: #004085; }
.classified-cat--avionics-or-gear-to-sale-or-buy { background: #d4edda; color: #155724; }
.classified-cat--hangars-or-property-for-sale-or-rent { background: #fff3cd; color: #856404; }
.classified-cat--safety-pilot-needs { background: #f8d7da; color: #721c24; }
.classified-cat--training-needs { background: #e8daef; color: #4a235a; }
.classified-cat--aircraft-parts { background: #e2e3e5; color: #383d41; }
.classified-cat--ride-sharing { background: #d0e8f2; color: #0c5460; }

.classified-detail__price {
  font-size: 1.75rem;
  font-weight: 700;
  color: var(--color-gold-dark);
  margin-bottom: var(--space-md);
}

.classified-detail__meta {
  background: var(--color-bg-alt);
  border-radius: var(--radius-md);
  padding: var(--space-lg);
  border: 1px solid var(--color-border);
  margin: var(--space-lg) 0;
}

.classified-detail__meta p {
  margin-bottom: var(--space-xs);
  font-size: 0.95rem;
}

.classified-detail__meta p:last-child {
  margin-bottom: 0;
}

.classified-gallery {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
  gap: var(--space-sm);
  margin-bottom: var(--space-lg);
}

.classified-gallery__item {
  aspect-ratio: 4 / 3;
  border-radius: var(--radius-sm);
  overflow: hidden;
  cursor: pointer;
  border: 2px solid transparent;
  transition: border-color .2s;
}

.classified-gallery__item:hover {
  border-color: var(--color-primary);
}

.classified-gallery__item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.classified-lightbox {
  display: none;
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,0.9);
  z-index: 10000;
  align-items: center;
  justify-content: center;
}

.classified-lightbox.is-open {
  display: flex;
}

.classified-lightbox__img {
  max-width: 90vw;
  max-height: 85vh;
  object-fit: contain;
  border-radius: var(--radius-sm);
}

.classified-lightbox__close {
  position: absolute;
  top: var(--space-md);
  right: var(--space-md);
  background: none;
  border: none;
  color: white;
  font-size: 2rem;
  cursor: pointer;
}

.classified-lightbox__nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  background: rgba(255,255,255,0.2);
  border: none;
  color: white;
  font-size: 2rem;
  padding: 0.5rem 1rem;
  cursor: pointer;
  border-radius: var(--radius-sm);
}

.classified-lightbox__nav:hover {
  background: rgba(255,255,255,0.3);
}

.classified-lightbox__prev { left: var(--space-md); }
.classified-lightbox__next { right: var(--space-md); }

.classified-form {
  max-width: 700px;
}

.classified-form__field {
  margin-bottom: var(--space-md);
}

.classified-form__field label {
  display: block;
  font-weight: 600;
  margin-bottom: 4px;
  font-size: 0.95rem;
}

.classified-form__field input,
.classified-form__field select,
.classified-form__field textarea {
  width: 100%;
  padding: 10px 12px;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  font-size: 1rem;
  font-family: inherit;
}

.classified-form__field textarea {
  min-height: 150px;
  resize: vertical;
}

.classified-form__field input:focus,
.classified-form__field select:focus,
.classified-form__field textarea:focus {
  outline: none;
  border-color: var(--color-primary);
  box-shadow: 0 0 0 3px rgba(30, 58, 123, .1);
}

.classified-form__hint {
  font-size: 0.82rem;
  color: var(--color-text-light);
  margin-top: 4px;
}

.classified-form__row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-md);
}

.classified-form__images {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-sm);
  margin-top: var(--space-sm);
}

.classified-form__preview {
  width: 100px;
  height: 75px;
  object-fit: cover;
  border-radius: var(--radius-sm);
  border: 2px solid var(--color-border);
}

.classified-owner-actions {
  display: flex;
  gap: var(--space-sm);
  margin-top: var(--space-md);
  padding-top: var(--space-md);
  border-top: 1px solid var(--color-border);
}

.classifieds-pagination .page-numbers {
  display: inline-block;
  padding: 0.5rem 0.75rem;
  margin: 0 2px;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  font-size: 0.9rem;
  color: var(--color-text);
  transition: all .2s;
}

.classifieds-pagination .page-numbers.current,
.classifieds-pagination .page-numbers:hover {
  background: var(--color-primary);
  color: var(--color-white);
  border-color: var(--color-primary);
}

@media (max-width: 768px) {
  .classifieds-grid {
    grid-template-columns: 1fr 1fr;
  }
  .classified-form__row {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 480px) {
  .classifieds-grid {
    grid-template-columns: 1fr;
  }
}

/* ═══════════════════════════════════════════════
   CORPORATE MEMBERS
   ═══════════════════════════════════════════════ */

.corporate-members-list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--space-lg);
}

.corporate-member {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: var(--space-lg);
  background: var(--color-white);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  transition: border-color 0.2s, box-shadow 0.2s;
}

.corporate-member:hover {
  border-color: var(--color-primary);
  box-shadow: var(--shadow-sm);
}

.corporate-member__logo {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 180px;
  height: 120px;
  margin-bottom: var(--space-md);
}

.corporate-member__logo img {
  max-width: 100%;
  max-height: 120px;
  object-fit: contain;
}

.corporate-member__info {
  flex: 1;
  min-width: 0;
}

.corporate-member__name {
  font-size: 1.15rem;
  font-weight: 700;
  color: var(--color-primary);
  margin: 0 0 0.5rem;
}

.corporate-member__desc {
  font-size: 0.95rem;
  line-height: 1.6;
  color: var(--color-text);
  margin: 0 0 0.75rem;
}

.corporate-member__link {
  display: inline-block;
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--color-primary);
  text-decoration: none;
  padding: 0.4rem 1rem;
  border: 2px solid var(--color-primary);
  border-radius: var(--radius-sm);
  transition: background 0.2s, color 0.2s;
}

.corporate-member__link:hover {
  background: var(--color-primary);
  color: var(--color-white);
}

@media (max-width: 768px) {
  .corporate-members-list {
    grid-template-columns: 1fr;
  }
}

/* Sponsor Sidebar Widget */
.sponsor-widget {
  text-align: center;
}

.sponsor-widget__logo {
  max-height: 80px;
  width: auto;
  margin: 0 auto var(--space-sm);
  object-fit: contain;
}

.sponsor-widget__name {
  font-size: 0.95rem;
  font-weight: 700;
  color: var(--color-primary);
  margin: 0 0 0.25rem;
}

.sponsor-widget__tagline {
  font-size: 0.8rem;
  font-style: italic;
  color: var(--color-text-light);
  margin: 0 0 0.75rem;
}

.sponsor-widget__link {
  display: inline-block;
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--color-primary);
  padding: 0.35rem 0.85rem;
  border: 2px solid var(--color-primary);
  border-radius: var(--radius-sm);
  transition: background 0.2s, color 0.2s;
}

.sponsor-widget__link:hover {
  background: var(--color-primary);
  color: var(--color-white);
}

/* ─────────────────────────────────────────────
   METAR Widget
   ───────────────────────────────────────────── */

.metar-widget {
  font-size: 0.82rem;
  background: var(--color-white);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  overflow: hidden;
}

/* Header: airport ID, flight-category badge, obs time */
.metar-widget__header {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.4rem 0.75rem;
  background: var(--color-primary);
  color: var(--color-white);
}

.metar-widget__icao {
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  flex-shrink: 0;
}

.metar-widget__fltcat {
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.07em;
  padding: 0.1em 0.55em;
  border-radius: 3px;
  background: rgba(255,255,255,0.2);
  color: var(--color-white);
  flex-shrink: 0;
}

.metar-widget__fltcat--vfr  { background: #28a745; }
.metar-widget__fltcat--mvfr { background: #007bff; }
.metar-widget__fltcat--ifr  { background: #dc3545; }
.metar-widget__fltcat--lifr { background: #6f42c1; }

.metar-widget__time {
  font-size: 0.7rem;
  opacity: 0.75;
  margin-left: auto;
  white-space: nowrap;
}

/* Body: data grid + comment */
.metar-widget__body {
  padding: 0.5rem 0.75rem 0.4rem;
}

.metar-widget__loading {
  color: var(--color-text-light);
  font-style: italic;
  margin: 0;
  padding: 0.25rem 0;
}

/* Data grid — pairs of cells per row */
.metar-widget__data {
  display: flex;
  flex-direction: column;
  gap: 1px;
}

.metar-widget__pair {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1px;
  background: var(--color-border);
  border-radius: 2px;
  overflow: hidden;
}

.metar-widget__pair + .metar-widget__pair {
  margin-top: 2px;
}

.metar-widget__cell {
  display: flex;
  flex-direction: column;
  padding: 0.25rem 0.4rem;
  background: var(--color-bg);
  min-width: 0;
}

.metar-widget__cell--full {
  grid-column: 1 / -1;
}

.metar-widget__cell--wide {
  grid-column: span 1;
}

.metar-widget__label {
  font-size: 0.65rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--color-text-light);
  line-height: 1.2;
}

.metar-widget__value {
  font-size: 0.8rem;
  font-weight: 500;
  color: var(--color-text);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: 1.3;
}

/* Snarky comment */
.metar-widget__comment {
  margin: 0.5rem 0 0.1rem;
  font-size: 0.75rem;
  font-style: italic;
  line-height: 1.45;
  padding: 0.35rem 0.5rem;
  border-radius: var(--radius-sm);
  border-left: 3px solid var(--color-border);
  color: var(--color-text-light);
}

.metar-widget__comment--vfr {
  border-color: #28a745;
  background: #f0faf3;
  color: #1a5c2e;
}

.metar-widget__comment--mvfr {
  border-color: #007bff;
  background: #f0f6ff;
  color: #0a3d7a;
}

.metar-widget__comment--ifr,
.metar-widget__comment--lifr {
  border-color: #dc3545;
  background: #fff5f5;
  color: #7a1a20;
}

/* Footer: airport change input */
.metar-widget__footer {
  padding: 0.35rem 0.75rem;
  background: var(--color-bg);
  border-top: 1px solid var(--color-border);
}

.metar-widget__airport-input {
  width: 100%;
  padding: 0.2rem 0.45rem;
  font-size: 0.78rem;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  background: var(--color-white);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--color-text);
}

.metar-widget__airport-input::placeholder {
  text-transform: none;
  letter-spacing: normal;
  color: var(--color-text-light);
}

/* ── TAF Widget ── */
.taf-widget {
  font-size: 0.82rem;
  background: var(--color-white);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  overflow: hidden;
  margin-top: 0.75rem;
}
.taf-widget__header {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.4rem 0.75rem;
  background: #2c5282;
  color: var(--color-white);
}
.taf-widget__title {
  font-size: 0.72rem;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.08em;
  background: rgba(255,255,255,0.2);
  padding: 0.1em 0.5em;
  border-radius: 3px;
}
.taf-widget__icao {
  font-size: 1rem;
  font-weight: 700;
  letter-spacing: 0.06em;
}
.taf-widget__time {
  font-size: 0.7rem;
  opacity: 0.75;
  margin-left: auto;
  white-space: nowrap;
}
.taf-widget__body {
  padding: 0.5rem 0.75rem 0.4rem;
}
.taf-widget__loading {
  color: var(--color-text-light);
  font-style: italic;
  margin: 0;
  padding: 0.25rem 0;
}
.taf-widget__valid {
  font-size: 0.72rem;
  color: var(--color-text-light);
  font-weight: 600;
  margin-bottom: 0.4rem;
}
.taf-widget__lines {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.taf-widget__line {
  font-family: 'SF Mono', 'Menlo', 'Consolas', monospace;
  font-size: 0.75rem;
  line-height: 1.5;
  padding: 0.25rem 0.4rem;
  background: var(--color-bg);
  border-radius: 3px;
  word-break: break-word;
  color: var(--color-text);
}
.taf-widget__line--fm {
  border-left: 3px solid #28a745;
  font-weight: 600;
}
.taf-widget__line--tempo {
  border-left: 3px solid #ffc107;
  font-style: italic;
}
.taf-widget__line--becmg {
  border-left: 3px solid #007bff;
}
.taf-widget__line--prob {
  border-left: 3px solid #6f42c1;
  font-style: italic;
}

/* ── Decoded TAF Periods ── */
.taf-widget__period {
  padding: 0.5rem 0.6rem;
  background: var(--color-bg);
  border-radius: 4px;
  margin-bottom: 4px;
  border-left: 3px solid var(--color-border);
}
.taf-widget__period--base {
  border-left-color: var(--color-cpa-blue, #3a73b2);
}
.taf-widget__period--fm {
  border-left-color: #28a745;
}
.taf-widget__period--tempo {
  border-left-color: #ffc107;
}
.taf-widget__period--becmg {
  border-left-color: #007bff;
}
.taf-widget__period--prob {
  border-left-color: #6f42c1;
}
.taf-widget__period-header {
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--color-heading, var(--color-text));
  margin-bottom: 0.25rem;
}
.taf-widget__period-details {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 1px;
}
.taf-widget__period-details li {
  font-size: 0.75rem;
  line-height: 1.5;
  color: var(--color-text);
  padding-left: 0.75rem;
  position: relative;
}
.taf-widget__period-details li::before {
  content: '·';
  position: absolute;
  left: 0;
  font-weight: 700;
  color: var(--color-text-muted, #999);
}
.taf-widget__footer {
  padding: 0.35rem 0.75rem;
  background: var(--color-bg);
  border-top: 1px solid var(--color-border);
}
.taf-widget__airport-input {
  width: 100%;
  padding: 0.2rem 0.45rem;
  font-size: 0.78rem;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  background: var(--color-white);
  text-transform: uppercase;
  letter-spacing: 0.08em;
  color: var(--color-text);
}
.taf-widget__airport-input::placeholder {
  text-transform: none;
  letter-spacing: normal;
  color: var(--color-text-light);
}


/* ── Safety Tip Widget ── */
.safety-tip-widget {
  font-size: 0.82rem;
  background: var(--color-white);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  overflow: hidden;
  margin-top: 0.75rem;
}
.safety-tip-widget__header {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.5rem 0.75rem;
  border-bottom: 1px solid var(--color-border);
}
.safety-tip-widget__shield {
  flex-shrink: 0;
}
.safety-tip-widget__label {
  font-size: 0.88rem;
  font-weight: 700;
  color: #C8102E;
}
.safety-tip-widget__body {
  padding: 0.65rem 0.75rem;
}
.safety-tip-widget__title {
  font-size: 0.92rem;
  font-weight: 700;
  color: var(--color-text);
  margin-bottom: 0.3rem;
}
.safety-tip-widget__text {
  font-size: 0.82rem;
  line-height: 1.5;
  color: var(--color-text-light);
}
.safety-tip-widget__footer {
  padding: 0.5rem 0.75rem 0.65rem;
}
.safety-tip-widget__btn {
  display: inline-block;
  padding: 0.3rem 0.85rem;
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--color-text);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  text-decoration: none;
  transition: background 0.15s;
}
.safety-tip-widget__btn:hover {
  background: var(--color-bg);
}


/* ─────────────────────────────────────────────
   Utility additions
   ───────────────────────────────────────────── */

.btn-sm {
  padding: 0.4rem 0.9rem;
  font-size: 0.82rem;
}

.btn-outline {
  background: transparent;
  color: var(--color-primary);
  border-color: var(--color-primary);
}
.btn-outline:hover {
  background: var(--color-primary);
  color: var(--color-white);
}

.section-title--left {
  text-align: left;
  font-size: 1.2rem;
  margin-bottom: var(--space-md);
}
.section-title--left::after {
  margin-left: 0;
}

/* ─────────────────────────────────────────────
   Homepage — Event Countdown Bar
   ───────────────────────────────────────────── */

.event-countdown-bar {
  background: var(--color-primary);
  color: var(--color-white);
  padding: 0.6rem 0;
}

.event-countdown-bar__inner {
  display: flex;
  align-items: center;
  gap: var(--space-sm);
}

.event-countdown-bar__icon {
  font-size: 1.3rem;
  flex-shrink: 0;
}

.event-countdown-bar__info {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-width: 0;
}

.event-countdown-bar__label {
  font-size: 0.65rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  opacity: 0.7;
}

.event-countdown-bar__title {
  font-size: 0.95rem;
  font-weight: 600;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* ─────────────────────────────────────────────
   Homepage — 6 Feature Nav Cards
   ───────────────────────────────────────────── */

.home-feature-nav {
  padding: var(--space-md) 0;
  background: var(--color-white);
  border-bottom: 1px solid var(--color-border);
}

.feature-nav-grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: var(--space-sm);
}

.feature-nav-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.4rem;
  padding: var(--space-md) var(--space-sm);
  background: var(--color-bg);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  text-decoration: none;
  color: var(--color-text);
  transition: all var(--transition);
  text-align: center;
}

.feature-nav-card:hover {
  background: var(--color-primary);
  color: var(--color-white);
  border-color: var(--color-primary);
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(0,0,0,0.12);
}

.feature-nav-card__icon {
  font-size: 1.6rem;
  line-height: 1;
}

.feature-nav-card__label {
  font-size: 0.78rem;
  font-weight: 600;
  line-height: 1.2;
}

/* ─────────────────────────────────────────────
   Homepage — Content Grid (News + Sidebar)
   ───────────────────────────────────────────── */

.home-content-section {
  padding: var(--space-xl) 0;
}

.home-content-grid {
  display: grid;
  grid-template-columns: 1fr 280px;
  gap: var(--space-xl);
  align-items: start;
}

.home-content-sidebar {
  position: sticky;
  top: 100px;
}

/* News list */
/* ── Photo of the Month ──
   This month's call to action and last month's winner are one feature, so they
   share one box rather than reading as two unrelated cards stacked up. The
   accent follows whichever phase is showing.

   The top margin also replaces the breathing room the old full-width "All News"
   button used to provide between this and the news feed. */
.home-potm {
  margin-top: var(--space-xl);
  margin-bottom: var(--space-lg);
  border: 2px solid var(--potm-accent, #b8860b);
  border-radius: 12px;
  overflow: hidden;
  background: var(--color-white, #fff);
}
.home-potm .home-potm-card + .home-potm-card {
  border-top: 1px solid #ece3d2;
}
/* A shadow would be clipped by the wrapper, and a background colour cannot
   show through the CTA's gradient, so the hover dims the whole card instead. */
.home-potm-card {
  transition: filter 0.15s;
}
.home-potm-card:hover,
.home-potm-card:focus-visible {
  filter: brightness(0.97);
}
/* Sized here rather than on the element: an inline width outranks the media
   query below, so the photo stayed 160px wide on a phone and left the rest of
   the card empty. */
/* :not(.emoji) because WordPress swaps the camera character in the call to
   action for an <img class="emoji">, which would otherwise be sized as though
   it were the winning photograph. */
.home-potm-card img:not(.emoji) {
  width: 160px;
  height: 120px;
  object-fit: cover;
  flex-shrink: 0;
}
@media (max-width: 600px) {
  .home-potm-card { flex-direction: column; }
  .home-potm-card img:not(.emoji) { width: 100%; height: 180px; }
  .home-potm-card > div { padding: 0.75rem !important; }
  .home-potm-card span:last-child { text-align: center; }
}

/* The heading and the link to the archive share a row, so the archive is
   reachable without scrolling the list first and costs no vertical space of
   its own. */
.home-news-head {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: var(--space-md);
  flex-wrap: wrap;
}
.home-news-head .section-title {
  margin-bottom: var(--space-sm);
}
.home-news-head__all {
  flex: 0 0 auto;
  font-size: 0.75rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--color-primary);
  text-decoration: none;
  border: 1px solid var(--color-border);
  border-radius: 5px;
  padding: 0.22rem 0.65rem;
  white-space: nowrap;
  transition: background 0.15s, color 0.15s, border-color 0.15s;
}
.home-news-head__all:hover,
.home-news-head__all:focus-visible {
  background: var(--color-primary);
  border-color: var(--color-primary);
  color: #fff;
}

.home-news-list {
  display: flex;
  flex-direction: column;
  gap: var(--space-sm);
}

/* ── Legacy news items (kept for compatibility) ── */
.home-news-item {
  display: flex;
  gap: var(--space-sm);
  align-items: flex-start;
}

/* The title, date and excerpt had no rules of their own, so they fell back to
   the document defaults: a 22px h3 and a 17px p, each carrying a 16px margin.
   That is most of the 150px an item used to take, and none of it was the
   picture — the thumbnail was 68px of it. Sized deliberately here instead. */
.home-news-item__body { min-width: 0; }
.home-news-item__meta {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  flex-wrap: wrap;
  margin-bottom: 0.15rem;
}
.home-news-item__badge {
  font-size: 0.62rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--color-primary);
  background: #e8eef8;
  padding: 0.05rem 0.35rem;
  border-radius: 3px;
  line-height: 1.5;
}
.home-news-item__date,
.home-news-item__source {
  font-size: 0.68rem;
  line-height: 1.5;
  color: var(--color-text-muted, #718096);
}
.home-news-item__title {
  font-size: 0.98rem;
  line-height: 1.3;
  margin: 0 0 0.12rem;
}
.home-news-item__excerpt {
  font-size: 0.8rem;
  line-height: 1.45;
  margin: 0;
  color: var(--color-text-muted, #4a5568);
  /* Two lines keeps every item the same height whatever the source wrote. */
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.home-news-item__thumb {
  width: 84px;
  height: 56px;
  flex-shrink: 0;
  border-radius: var(--radius-sm);
  overflow: hidden;
  display: block;
  background: var(--color-bg-alt);
}
.home-news-item__thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.home-news-item__thumb--placeholder {
  background: linear-gradient(135deg, var(--color-bg-alt), var(--color-border));
}
.home-news-item__thumb--color-0 {
  background: linear-gradient(135deg, #3a73b2, #2c5a8f);
}
.home-news-item__thumb--color-1 {
  background: linear-gradient(135deg, #d97706, #b45309);
}
.home-news-item__thumb--color-2 {
  background: linear-gradient(135deg, #059669, #047857);
}
.home-news-item__thumb--color-3 {
  background: linear-gradient(135deg, #7c3aed, #6d28d9);
}

/* ── News Card Grid ── */
.home-news-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-md);
}
.home-news-card {
  background: var(--color-white);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  overflow: hidden;
  transition: border-color 0.2s, box-shadow 0.2s, transform 0.2s;
}
.home-news-card:hover {
  border-color: var(--color-primary);
  box-shadow: var(--shadow-sm);
  transform: translateY(-2px);
}
.home-news-card--featured {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: 1.2fr 1fr;
}
.home-news-card__image {
  display: block;
  overflow: hidden;
  background: var(--color-bg-alt);
  aspect-ratio: 16 / 10;
}
.home-news-card--featured .home-news-card__image {
  aspect-ratio: auto;
  min-height: 200px;
}
.home-news-card__image img,
.home-news-card__image svg {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.3s ease;
}
.home-news-card:hover .home-news-card__image img,
.home-news-card:hover .home-news-card__image svg {
  transform: scale(1.04);
}
.home-news-card__placeholder {
  width: 100%;
  height: 100%;
}
.home-news-card__body {
  padding: var(--space-sm) var(--space-md);
}
.home-news-card--featured .home-news-card__body {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: var(--space-lg);
}
.home-news-card__date {
  display: block;
  font-size: 0.72rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--color-primary-light, var(--color-primary));
  margin-bottom: 0.35rem;
}
.home-news-card__title {
  font-size: 0.95rem;
  margin: 0 0 0.35rem;
  line-height: 1.35;
}
.home-news-card--featured .home-news-card__title {
  font-size: 1.2rem;
}
.home-news-card__title a {
  color: var(--color-text);
  text-decoration: none;
}
.home-news-card__title a:hover {
  color: var(--color-primary);
}
.home-news-card__excerpt {
  font-size: 0.82rem;
  color: var(--color-text-light);
  margin: 0;
  line-height: 1.5;
}
@media (max-width: 640px) {
  .home-news-grid {
    grid-template-columns: 1fr;
  }
  .home-news-card--featured {
    grid-template-columns: 1fr;
  }
  .home-news-card--featured .home-news-card__image {
    aspect-ratio: 16 / 10;
    min-height: auto;
  }
}

/* Podcast + CPA Presents row */
.home-media-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--space-md);
  margin-top: var(--space-xl);
}

.home-media-card {
  background: var(--color-white);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  padding: var(--space-md);
  text-decoration: none;
  color: var(--color-text);
  display: block;
}

.home-media-card--presents {
  display: flex;
  gap: var(--space-sm);
  align-items: flex-start;
  transition: box-shadow var(--transition);
}
.home-media-card--presents:hover {
  box-shadow: 0 4px 16px rgba(0,0,0,0.1);
}

.home-media-card__badge {
  display: inline-block;
  font-size: 0.62rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 0.15em 0.5em;
  border-radius: 3px;
  background: var(--color-primary);
  color: var(--color-white);
  margin-bottom: var(--space-xs);
}

.home-media-card__badge--gold {
  background: var(--color-gold);
  color: var(--color-dark);
}

.home-media-card__title {
  font-size: 0.9rem;
  margin: 0.25rem 0 0.2rem;
}

.home-media-card__sub {
  font-size: 0.78rem;
  color: var(--color-text-light);
  margin: 0 0 var(--space-sm);
  line-height: 1.4;
}

.home-media-card__presents-thumb {
  width: 80px;
  height: 80px;
  flex-shrink: 0;
  background: linear-gradient(135deg, var(--color-dark), var(--color-primary-dark));
  border-radius: var(--radius-sm);
  display: flex;
  align-items: center;
  justify-content: center;
}

.home-media-card__play {
  width: 30px;
  height: 30px;
  background: rgba(255,255,255,0.15);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--color-white);
  font-size: 0.75rem;
}

.home-media-card__presents-info {
  flex: 1;
  min-width: 0;
}

/* Podcast platform buttons */
.home-media-card__platforms {
  display: flex;
  flex-wrap: wrap;
  gap: 0.3rem;
  margin-top: var(--space-xs);
}

.platform-btn {
  display: inline-block;
  padding: 0.2rem 0.5rem;
  font-size: 0.68rem;
  font-weight: 600;
  border-radius: 3px;
  text-decoration: none;
  color: var(--color-white);
  transition: opacity 0.15s;
}
.platform-btn:hover { opacity: 0.85; color: var(--color-white); }

.platform-btn--podbean { background: #6F4E37; }
.platform-btn--apple   { background: #9933CC; }
.platform-btn--spotify { background: #1DB954; }
.platform-btn--amazon  { background: #00A8E1; }
.platform-btn--iheart  { background: #C6002B; }
.platform-btn--youtube { background: #FF0000; }

/* Merch strip */
.home-merch-strip {
  margin-top: var(--space-xl);
}

.home-merch-scroll {
  display: flex;
  gap: var(--space-md);
  overflow-x: auto;
  padding-bottom: var(--space-sm);
  scrollbar-width: thin;
}

.merch-card {
  flex: 0 0 130px;
  background: var(--color-white);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-sm);
  overflow: hidden;
  text-decoration: none;
  color: var(--color-text);
  transition: box-shadow var(--transition);
}
.merch-card:hover {
  box-shadow: 0 4px 12px rgba(0,0,0,0.1);
}

.merch-card__thumb {
  height: 80px;
  background: linear-gradient(135deg, var(--color-bg-alt), var(--color-border));
}

.merch-card__info {
  padding: 0.4rem 0.5rem;
  display: flex;
  flex-direction: column;
  gap: 0.1rem;
}

.merch-card__name {
  font-size: 0.75rem;
  font-weight: 600;
}

.merch-card__price {
  font-size: 0.7rem;
  color: var(--color-text-light);
}

/* ── Responsive: homepage ── */
@media (max-width: 1024px) {
  .home-content-grid {
    grid-template-columns: 1fr;
  }
  .home-content-sidebar {
    position: static;
  }
  .feature-nav-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media (max-width: 768px) {
  .feature-nav-grid {
    grid-template-columns: repeat(3, 1fr);
    gap: 0.4rem;
  }
  .feature-nav-card {
    padding: var(--space-sm) 0.25rem;
  }
  .feature-nav-card__icon {
    font-size: 1.3rem;
  }
  .feature-nav-card__label {
    font-size: 0.7rem;
  }
  .home-media-row {
    grid-template-columns: 1fr;
  }
  .event-countdown-bar__title {
    font-size: 0.82rem;
  }
}

/* ═══════════════════ Fly-In Hub ═══════════════════ */

/* ── Hero ── */
.flyin-hero {
  position: relative;
  background-size: cover;
  background-position: center 40%;
  color: #fff;
  padding: 3rem 0;
  text-align: center;
  min-height: 180px;
  display: flex;
  align-items: center;
}
.flyin-hero__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(30, 58, 123, 0.75), rgba(20, 41, 84, 0.85));
}
.flyin-hero__inner {
  position: relative;
  z-index: 1;
}
.flyin-hero__title {
  font-family: var(--font-heading);
  font-size: 2.2rem;
  font-weight: 900;
  margin: 0 0 0.25rem;
}
.flyin-hero__logo {
  height: 44px;
  width: auto;
  border-radius: 4px;
  margin-bottom: 0.5rem;
  opacity: 0.9;
}
.flyin-hero__subtitle {
  font-size: 0.95rem;
  opacity: 0.85;
  max-width: 600px;
  margin: 0 auto;
  line-height: 1.5;
}

/* ── Sub-Navigation ── */
.flyin-sub-nav {
  background: #fff;
  border-bottom: 1px solid var(--color-border);
  position: sticky;
  top: 0;
  z-index: 50;
}
@supports (position: sticky) {
  .admin-bar .flyin-sub-nav { top: 32px; }
}
.flyin-sub-nav__list {
  display: flex;
  gap: 0.4rem;
  overflow-x: auto;
  padding: 0.75rem 0;
  -webkit-overflow-scrolling: touch;
}
.flyin-sub-nav__item {
  flex-shrink: 0;
  padding: 0.35rem 1rem;
  border-radius: 999px;
  font-size: 0.82rem;
  font-weight: 500;
  color: var(--color-text-light);
  background: #fff;
  border: 1px solid var(--color-border);
  text-decoration: none;
  white-space: nowrap;
  transition: all 0.2s ease;
}
.flyin-sub-nav__item:hover {
  color: var(--color-primary);
  border-color: var(--color-primary);
  background: #eaf2f8;
}
.flyin-sub-nav__item--active {
  background: var(--color-primary);
  color: #fff;
  border-color: var(--color-primary);
}
.flyin-sub-nav__item--active:hover {
  background: var(--color-primary);
  color: #fff;
}
.flyin-sub-nav__item:focus-visible {
  outline: 2px solid var(--color-primary);
  outline-offset: 2px;
}
.flyin-season-card:focus-visible,
.flyin-resource-card:focus-visible,
.flyin-past-card:focus-visible {
  outline: 2px solid var(--color-primary);
  outline-offset: 2px;
}

/* ── Hub container ── */
.flyin-hub {
  padding-top: 2rem;
  padding-bottom: 3rem;
}

/* ── Welcome + Stats Grid ── */
.flyin-welcome-grid {
  display: grid;
  grid-template-columns: 1fr 280px;
  gap: 1.5rem;
  align-items: flex-start;
  margin-bottom: 2.5rem;
}
.flyin-welcome-card {
  min-width: 0;
  background: #fff;
  border: 1px solid var(--color-border);
  border-radius: 8px;
  padding: 1.5rem;
}
.flyin-welcome-card__header {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin-bottom: 1rem;
}
.flyin-welcome-card__logo {
  height: 50px !important;
  width: auto !important;
  max-width: none;
  border-radius: 4px;
}
.flyin-welcome-card__title {
  font-family: var(--font-heading);
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--color-primary);
  margin: 0;
}
.flyin-welcome-card__role {
  font-size: 0.75rem;
  color: #999;
}
.flyin-welcome-card__content {
  font-size: 0.88rem;
  color: #555;
  line-height: 1.65;
}
.flyin-welcome-card__content p,
.flyin-welcome-card__content {
  margin: 0 0 0.75rem;
  max-width: 100% !important;
}
.flyin-welcome-card__attribution {
  margin-top: 1rem;
  font-size: 0.78rem;
  color: #999;
  font-style: italic;
}

/* ── Stats Stack ── */
.flyin-stats-stack {
  flex: 0 0 280px;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}
.flyin-stat-box {
  border-radius: 8px;
  padding: 1rem;
  text-align: center;
  color: #fff;
}
.flyin-stat-box--primary { background: var(--color-primary); }
.flyin-stat-box--success { background: #27ae60; }
.flyin-stat-box--gold    { background: var(--color-gold); color: var(--color-primary); }
.flyin-stat-box__number {
  display: block;
  font-size: 1.8rem;
  font-weight: 900;
  font-family: monospace;
  line-height: 1;
}
.flyin-stat-box__label {
  display: block;
  font-size: 0.72rem;
  opacity: 0.8;
  margin-top: 0.2rem;
}

/* ── Section headings ── */
.flyin-section {
  margin-bottom: 2.5rem;
}
.flyin-section__heading {
  font-family: var(--font-heading);
  font-size: 1.3rem;
  color: var(--color-primary);
  margin: 0 0 1rem;
}
.flyin-section__header-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 1rem;
}
.flyin-section__header-row .flyin-section__heading {
  margin-bottom: 0;
}
.flyin-section__view-all {
  font-size: 0.8rem;
  color: var(--color-primary-light);
  text-decoration: none;
}
.flyin-section__view-all:hover {
  text-decoration: underline;
}

/* ── Season Cards Grid ── */
.flyin-season-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1rem;
}
.flyin-season-card {
  display: block;
  background: #fff;
  border: 1px solid var(--color-border);
  border-radius: 8px;
  overflow: hidden;
  text-decoration: none;
  color: inherit;
  transition: box-shadow 0.2s ease, transform 0.2s ease;
}
.flyin-season-card:hover {
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
  transform: translateY(-2px);
}
.flyin-season-card__img {
  position: relative;
  height: 140px;
  background: linear-gradient(135deg, #c8a080, #b0a090);
  overflow: hidden;
}
.flyin-season-card__watermark {
  position: absolute;
  top: 0.5rem;
  right: 0.5rem;
  height: 28px !important;
  width: auto !important;
  max-width: none;
  opacity: 0.2;
  border-radius: 2px;
  pointer-events: none;
}
.flyin-season-card__thumb {
  width: 100%;
  height: 100%;
  object-fit: cover;
  /* A flyer is portrait and this frame is landscape, so cover throws most of
     it away. Anchored to the top, the part that survives is the title and the
     artwork — the bit that makes a member recognise the fly-in. Centred, which
     is what it did, a poster showed a band of its body text instead. Matches
     the event list; see .event-card__thumb img. */
  object-position: top;
}
.flyin-season-card__badge {
  position: absolute;
  bottom: 0.5rem;
  left: 0.5rem;
  padding: 0.2rem 0.6rem;
  border-radius: 3px;
  font-size: 0.7rem;
  font-weight: 700;
  color: #fff;
}
.flyin-season-card__badge--open     { background: #27ae60; }
.flyin-season-card__badge--active   { background: #c0392b; animation: active-pulse 2s infinite; }
@keyframes active-pulse { 0%,100%{opacity:1;} 50%{opacity:0.75;} }
.flyin-season-card__badge--planning { background: var(--color-gold); color: var(--color-primary); }
.flyin-season-card__badge--complete { background: #888; }
.flyin-season-card__body {
  padding: 1rem;
}
.flyin-season-card__title {
  font-family: var(--font-heading);
  font-size: 0.95rem;
  font-weight: 700;
  margin: 0 0 0.2rem;
}
.flyin-season-card__meta {
  font-size: 0.82rem;
  color: #666;
  margin: 0;
}

/* ── Empty State ── */
.flyin-empty-state {
  text-align: center;
  padding: 3rem 1.5rem;
  background: #fff;
  border: 1px solid var(--color-border);
  border-radius: 8px;
  color: #888;
}
.flyin-empty-state p {
  margin: 0 0 1rem;
  font-size: 0.9rem;
}

/* ── Resource Cards Grid ── */
.flyin-resource-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1rem;
}
.flyin-resource-card {
  display: block;
  background: #fff;
  border: 1px solid var(--color-border);
  border-top: 3px solid var(--color-primary);
  border-radius: 8px;
  padding: 1.2rem 0.8rem;
  text-align: center;
  text-decoration: none;
  color: inherit;
  transition: box-shadow 0.2s ease, transform 0.2s ease;
}
.flyin-resource-card:hover {
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
  transform: translateY(-2px);
}
.flyin-resource-card__icon {
  display: flex;
  justify-content: center;
  margin-bottom: 0.4rem;
  color: inherit;
}
.flyin-resource-card__icon svg {
  width: 28px;
  height: 28px;
}
.flyin-resource-card__title {
  font-size: 0.85rem;
  font-weight: 700;
  margin: 0 0 0.25rem;
}
.flyin-resource-card__desc {
  font-size: 0.8rem;
  color: #666;
  margin: 0;
  line-height: 1.4;
}

/* ── Past Fly-Ins Scroll ── */
.flyin-past-scroll {
  display: flex;
  gap: 1rem;
  overflow-x: auto;
  padding-bottom: 0.5rem;
  -webkit-overflow-scrolling: touch;
  -webkit-mask-image: linear-gradient(to right, transparent, black 2rem, black calc(100% - 2rem), transparent);
  mask-image: linear-gradient(to right, transparent, black 2rem, black calc(100% - 2rem), transparent);
}
.flyin-past-card {
  flex-shrink: 0;
  width: 150px;
  background: #fff;
  border: 1px solid var(--color-border);
  border-radius: 8px;
  overflow: hidden;
  text-decoration: none;
  color: inherit;
  transition: box-shadow 0.2s ease;
}
.flyin-past-card:hover {
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}
.flyin-past-card__img {
  height: 80px;
  background: linear-gradient(135deg, #c0c8d0, #a8b0b8);
}
.flyin-past-card__label {
  display: block;
  padding: 0.5rem;
  text-align: center;
  font-size: 0.78rem;
  font-weight: 600;
}

/* ── Photo Albums CTA ── */
.flyin-albums-cta {
  background: #fff;
  border: 1px solid var(--color-border);
  border-radius: 8px;
  padding: 1.5rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}
.flyin-albums-cta__title {
  font-family: var(--font-heading);
  font-size: 1rem;
  font-weight: 700;
  color: var(--color-primary);
  margin: 0;
}
.flyin-albums-cta__desc {
  font-size: 0.8rem;
  color: #666;
  margin: 0.2rem 0 0;
}

/* ── Fly-In Hub Responsive ── */
@media (max-width: 1024px) {
  .flyin-season-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .flyin-resource-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}
@media (max-width: 768px) {
  .flyin-hero__title { font-size: 1.4rem; }
  .flyin-welcome-grid {
    grid-template-columns: 1fr;
  }
  .flyin-stats-stack {
    flex: none;
    flex-direction: row;
    flex-wrap: wrap;
  }
  .flyin-stat-box {
    flex: 1;
    min-width: 100px;
  }
  .flyin-season-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .flyin-resource-grid {
    grid-template-columns: repeat(2, 1fr);
  }
  .flyin-albums-cta {
    flex-direction: column;
    text-align: center;
  }
}
@media (max-width: 480px) {
  .flyin-season-grid {
    grid-template-columns: 1fr;
  }
  .flyin-resource-grid {
    grid-template-columns: 1fr;
  }
  .flyin-stats-stack {
    flex-direction: column;
  }
}

/* ═══════════════════ Links Directory ═══════════════════ */

.linkdir-hero {
  background: linear-gradient(135deg, var(--color-primary) 0%, var(--color-primary-light) 100%);
  color: #fff;
  padding: 2rem 0;
  text-align: center;
}
.linkdir-hero h1 {
  font-size: 1.8rem;
  margin: 0;
  color: var(--color-gold);
}
.linkdir-hero p {
  font-size: 0.95rem;
  opacity: 0.85;
  margin: 0.4rem 0 0;
}

.linkdir-wrap {
  max-width: var(--wide-width);
  padding: var(--space-lg) var(--space-md);
}

/* ── Search ── */
.linkdir-search-wrap {
  position: relative;
  max-width: 600px;
  margin: 0 auto var(--space-lg);
}
.linkdir-search {
  width: 100%;
  padding: 0.75rem 1rem 0.75rem 2.5rem;
  font-size: 1rem;
  border: 2px solid var(--color-border);
  border-radius: var(--radius-md);
  background: var(--color-white);
  color: var(--color-text);
  transition: border-color var(--transition);
}
.linkdir-search:focus {
  outline: none;
  border-color: var(--color-primary);
  box-shadow: 0 0 0 3px rgba(30, 58, 123, 0.12);
}
.linkdir-search-icon {
  position: absolute;
  left: 0.75rem;
  top: 50%;
  transform: translateY(-50%);
  font-size: 1.1rem;
  opacity: 0.4;
  pointer-events: none;
}
.linkdir-no-results {
  text-align: center;
  padding: var(--space-xl) 0;
  color: var(--color-text-light);
  font-size: 1.05rem;
}

/* ── Jump Nav ── */
.linkdir-jump-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  justify-content: center;
  margin-bottom: var(--space-xl);
  padding: var(--space-md);
  background: var(--color-bg-alt);
  border-radius: var(--radius-md);
  border: 1px solid var(--color-border);
}
.linkdir-jump-pill {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  padding: 0.3rem 0.7rem;
  font-size: 0.8rem;
  font-weight: 500;
  color: var(--color-primary);
  background: var(--color-white);
  border: 1px solid var(--color-border);
  border-radius: 999px;
  text-decoration: none;
  transition: all var(--transition);
  white-space: nowrap;
}
.linkdir-jump-pill:hover {
  background: var(--color-primary);
  color: #fff;
  border-color: var(--color-primary);
}
.linkdir-pill-icon {
  font-size: 0.85rem;
}

/* ── Category Sections ── */
.linkdir-category {
  margin-bottom: var(--space-xl);
  scroll-margin-top: 1rem;
}
.linkdir-cat-header {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: var(--space-md);
  padding-bottom: 0.5rem;
  border-bottom: 2px solid var(--color-primary);
}
.linkdir-cat-icon {
  font-size: 1.3rem;
}
.linkdir-cat-header h2 {
  font-size: 1.25rem;
  margin: 0;
  color: var(--color-primary);
  flex: 1;
}
.linkdir-cat-count {
  background: var(--color-primary);
  color: #fff;
  font-size: 0.75rem;
  font-weight: 600;
  padding: 0.15rem 0.55rem;
  border-radius: 999px;
  min-width: 1.5rem;
  text-align: center;
}

/* ── Link Cards ── */
.linkdir-links-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: var(--space-md);
}
.linkdir-card {
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
  padding: 0.9rem 1rem;
  background: var(--color-white);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-md);
  text-decoration: none;
  transition: all var(--transition);
  border-left: 3px solid transparent;
}
.linkdir-card:hover {
  border-left-color: var(--color-primary);
  box-shadow: var(--shadow-md);
  transform: translateY(-1px);
}
.linkdir-card-name {
  font-weight: 600;
  font-size: 0.95rem;
  color: var(--color-primary);
  display: flex;
  align-items: center;
  gap: 0.3rem;
}
.linkdir-ext-icon {
  opacity: 0.4;
  flex-shrink: 0;
}
.linkdir-card:hover .linkdir-ext-icon {
  opacity: 0.7;
}
.linkdir-card-desc {
  font-size: 0.82rem;
  color: var(--color-text-light);
  line-height: 1.4;
}
.linkdir-card-url {
  font-size: 0.72rem;
  color: var(--color-text-light);
  opacity: 0.6;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* ── Card hidden by search ── */
.linkdir-card.linkdir-hidden {
  display: none;
}
.linkdir-category.linkdir-hidden {
  display: none;
}

/* ── Suggest ── */
.linkdir-suggest {
  text-align: center;
  padding: var(--space-lg) 0;
  color: var(--color-text-light);
  font-size: 0.95rem;
  border-top: 1px solid var(--color-border);
  margin-top: var(--space-lg);
}
.linkdir-suggest a {
  color: var(--color-primary);
  font-weight: 600;
}

/* ── Back to Top ── */
.linkdir-top-btn {
  position: fixed;
  bottom: 2rem;
  right: 2rem;
  background: var(--color-primary);
  color: #fff;
  border: none;
  border-radius: 50%;
  width: 44px;
  height: 44px;
  font-size: 1rem;
  cursor: pointer;
  box-shadow: var(--shadow-md);
  transition: all var(--transition);
  z-index: 90;
}
.linkdir-top-btn:hover {
  background: var(--color-primary-dark);
  transform: scale(1.1);
}

/* ── Responsive ── */
@media (max-width: 768px) {
  .linkdir-hero h1 {
    font-size: 1.4rem;
  }
  .linkdir-links-grid {
    grid-template-columns: 1fr;
  }
  .linkdir-jump-nav {
    gap: 0.3rem;
    padding: 0.6rem;
  }
  .linkdir-jump-pill {
    font-size: 0.72rem;
    padding: 0.25rem 0.5rem;
  }
  .linkdir-top-btn {
    bottom: 1rem;
    right: 1rem;
    width: 38px;
    height: 38px;
  }
}

/* ═══════════════════ Touch targets (#83) ═══════════════════
 *
 * A floor of 44px for anything you tap, on touch devices and narrow screens.
 * Apple HIG's minimum; WCAG 2.5.8 sets 24px as the floor and 44px as the
 * recommendation. This membership skews older, which makes a fiddly control
 * cost more than the count suggests.
 *
 * Deliberately not applied to links in running text. WCAG exempts an inline
 * link in a sentence, and stretching one to 44px would wreck the line spacing
 * of every paragraph on the site to fix a problem nobody has.
 *
 * min-height rather than height: several of these carry inline padding from
 * their templates, and an inline style only beats a stylesheet on the
 * properties it actually sets.
 */
@media (pointer: coarse), (max-width: 768px) {
    .site-container button,
    .site-container .btn,
    .site-container input[type="submit"],
    .site-container input[type="button"],
    .site-container input[type="text"],
    .site-container input[type="search"],
    .site-container input[type="email"],
    .site-container input[type="tel"],
    .site-container input[type="url"],
    .site-container input[type="number"],
    .site-container input[type="date"],
    .site-container input[type="password"],
    .site-container select,
    .site-container textarea,
    .site-header button,
    .site-header input[type="search"],
    .dark-mode-toggle {
        min-height: 44px;
    }

    /* Tap area belongs on the label, not on a stretched 20px box. */
    .site-container label:has(> input[type="checkbox"]),
    .site-container label:has(> input[type="radio"]) {
        min-height: 44px;
        display: flex;
        align-items: center;
        gap: 0.5rem;
    }

    /* These live outside .site-container, so they need naming directly:
       the directory's own search field and button, and the floating feedback
       tab, which was a 40px square — close enough to look deliberate and
       still short. */
    .dir-search,
    .dir-btn {
        min-height: 44px;
    }

    .cpa-fb__tab {
        min-height: 44px;
        min-width: 44px;
    }
}

/* The mark on a menu link that leaves the site.
 *
 * Small, dimmed and set slightly above the baseline: it is a note about the
 * link, not part of its name. Two of these exist today — Fly Colorado and
 * Mountain Flying LLC's rules of thumb — and CPA cannot vouch for what is on
 * the other end of either, so a reader is told before they click rather than
 * after they arrive. The arrow is aria-hidden; the words beside it are what a
 * screen reader reads. */
.nav-external {
  display: inline-block;
  vertical-align: -0.05em;
  margin-left: 0.3em;
  opacity: 0.55;
}

/* The rule above the first link that leaves the site.
 *
 * A glyph beside one item says "this one is different" but not how. The rule,
 * with the links gathered beneath it, says it once for the group — and the
 * label names what they are, which the icon alone never could. */
.mega-menu-subitem--offsite {
  border-top: 1px solid var(--color-border, #e2e8f0);
  margin-top: 0.4rem;
  padding-top: 0.45rem;
}

.mega-menu-subitem--offsite::before {
  content: "Elsewhere on the web";
  display: block;
  padding: 0 1rem 0.15rem;
  font-size: 0.68rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--color-text-light, #888);
}

/* The rule above the club's own interactive tools.
 *
 * Pilot Resources mixes three things you use into six things you read, and
 * sorted alphabetically they interleave. Same rule and same label treatment
 * as the off-site group above — one divider idiom, used twice. */
.mega-menu-subitem--tool {
  border-top: 1px solid var(--color-border, #e2e8f0);
  margin-top: 0.4rem;
  padding-top: 0.45rem;
}

.mega-menu-subitem--tool::before {
  content: "Tools";
  display: block;
  padding: 0 1rem 0.15rem;
  font-size: 0.68rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--color-text-light, #888);
}