/*
Theme Name: Calisthenics Child
Theme URI: https://calisthenics.org
Template: blocksy
Description: Calisthenics.org — Sthenics Network brand system
Version: 2.0.0
Author: Sthenics Network
*/

/* ═══════════════════════════════
   TOKENS
═══════════════════════════════ */
:root {
  --bg:        #0F0C09;
  --bg-warm:   #161210;
  --bg-card:   #1A1612;
  --bg-lift:   #211D18;
  --text-1:    #F7F0E0;
  --text-2:    #C4B89A;
  --text-3:    #7A6F60;
  --cyan:      #00D4FF;
  --tiffany:   #7ECECA;
  --gold:      #C8A05A;
  --border:    rgba(247,240,224,0.07);
  --border-hi: rgba(247,240,224,0.14);

  --font-serif: 'Fraunces', Georgia, serif;
  --font-sans:  'DM Sans', system-ui, sans-serif;
  --font-mono:  'JetBrains Mono', monospace;

  --cat-push:     #FF5C45;
  --cat-pull:     #45B8FF;
  --cat-squat:    #52D46A;
  --cat-core:     #B87AFF;
  --cat-balance:  #FF9A3C;
  --cat-jump:     #FFE03C;
  --cat-masters:  #7EC47E;
  --cat-history:  #5A9EE8;
  --cat-culture:  #FFB03C;
  --cat-flow:     #70D4C0;
  --cat-mobility: #D470B8;
  --cat-current:  var(--cyan);

  --radius:    10px;
  --radius-lg: 16px;
}

/* ═══════════════════════════════
   NUCLEAR BACKGROUND RESET
   Forces dark on every Blocksy container
═══════════════════════════════ */
*,
html,
body,
#page,
.site,
.site-content,
#content,
.ct-container,
.ct-container-fluid,
.ct-main,
main,
main.site-main,
.wp-site-blocks,
div[data-id="main"] {
  background-color: var(--bg) !important;
}

body {
  font-family: var(--font-sans) !important;
  font-size: 18px !important;
  line-height: 1.8 !important;
  color: var(--text-1) !important;
  -webkit-font-smoothing: antialiased;
}

/* ═══════════════════════════════
   HEADER — kill the white box
═══════════════════════════════ */
header,
.ct-header,
#masthead,
.site-header,
[data-id="header"],
.ct-header-builder,
.ct-header-builder > *,
.ct-header-builder > * > *,
.header-desktop,
.ct-main-header,
.ct-group,
.ct-header .ct-group,
.ct-container.ct-header {
  background: var(--bg) !important;
  background-color: var(--bg) !important;
  border-bottom: 1px solid var(--border) !important;
  box-shadow: none !important;
}

/* Logo text */
.site-title,
.ct-site-title,
.ct-logo,
.site-branding .site-title a,
.ct-site-title a {
  font-family: var(--font-serif) !important;
  font-optical-sizing: auto !important;
  font-size: 22px !important;
  font-weight: 700 !important;
  color: var(--text-1) !important;
  letter-spacing: -0.02em !important;
  text-decoration: none !important;
}

/* Nav links */
.ct-menu > li > a,
.ct-main-header-menu a,
.main-navigation a,
nav a,
.menu-item a {
  font-family: var(--font-sans) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: var(--text-2) !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
  transition: color 0.2s !important;
  padding: 0 14px !important;
}

.ct-menu > li > a:hover,
.ct-main-header-menu a:hover,
nav a:hover {
  color: var(--text-1) !important;
}

/* ═══════════════════════════════
   BLOG FEED / ARCHIVE
═══════════════════════════════ */
.ct-posts-container,
.posts-container,
.ct-blog,
.ct-blog-grid,
.content-area,
.site-content .wrap {
  background: var(--bg) !important;
  padding-top: 48px !important;
}

/* Post card */
article,
article.post,
.ct-post,
.ct-post-card,
.type-post {
  background: var(--bg-card) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius-lg) !important;
  overflow: hidden !important;
  transition: border-color 0.25s, transform 0.25s !important;
  margin-bottom: 24px !important;
}

article:hover,
.ct-post:hover,
.ct-post-card:hover {
  border-color: var(--border-hi) !important;
  transform: translateY(-2px) !important;
}

/* Card inner padding */
.ct-post-card .ct-post-content,
.entry-summary,
.ct-post .entry-header,
.ct-post-card > div {
  padding: 28px 32px !important;
}

/* Category labels on cards */
.cat-links a,
.cat-links,
.ct-meta-category a,
.ct-meta-category,
.entry-meta .cat-links a,
a[rel="category tag"],
.post-categories a {
  font-family: var(--font-mono) !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  color: var(--cat-current, var(--cyan)) !important;
  background: color-mix(in srgb, var(--cat-current, var(--cyan)) 14%, transparent) !important;
  border: 1px solid color-mix(in srgb, var(--cat-current, var(--cyan)) 30%, transparent) !important;
  padding: 4px 10px !important;
  border-radius: 100px !important;
  text-decoration: none !important;
  display: inline-block !important;
  margin-right: 6px !important;
  margin-bottom: 12px !important;
}

/* Post titles in feed */
.entry-title,
.entry-title a,
h2.entry-title,
h2.entry-title a,
h1.entry-title,
h1.entry-title a,
.ct-post-card .ct-post-title,
.ct-post-card .ct-post-title a,
h2.ct-post-title a,
.ct-post h2 a,
.ct-post h1 a {
  font-family: var(--font-serif) !important;
  font-optical-sizing: auto !important;
  font-size: clamp(1.35rem, 3vw, 1.65rem) !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
  color: var(--cyan) !important;
  text-decoration: none !important;
  letter-spacing: -0.02em !important;
  margin-bottom: 12px !important;
}

.entry-title a:hover,
.ct-post-card .ct-post-title a:hover,
.ct-post h2 a:hover {
  color: var(--gold) !important;
}

/* Force all h1/h2/h3 in content area to be readable */
h1, h2, h3, h4, h5, h6 {
  color: var(--text-1) !important;
  font-family: var(--font-serif) !important;
  font-optical-sizing: auto !important;
}

/* Blocksy default link color override — nuke it */
a,
.ct-color-primary,
:root .ct-color-primary {
  color: var(--cyan) !important;
}

/* Kill any Blocksy blue (#0e79d1 or similar) */
[style*="color: #0e"],
[style*="color:#0e"] {
  color: var(--cyan) !important;
}

/* Excerpt */
.entry-summary p,
.entry-summary,
.ct-post-excerpt,
.ct-post-card .ct-post-excerpt {
  font-family: var(--font-sans) !important;
  font-size: 16px !important;
  line-height: 1.7 !important;
  color: var(--text-2) !important;
  margin-bottom: 16px !important;
}

/* Date + author meta */
.entry-meta,
.posted-on,
.byline,
.ct-meta-date,
.ct-meta-author,
.entry-date,
.entry-meta a {
  font-family: var(--font-mono) !important;
  font-size: 11px !important;
  color: var(--text-3) !important;
  letter-spacing: 0.06em !important;
  text-transform: uppercase !important;
  text-decoration: none !important;
}

/* ═══════════════════════════════
   SINGLE POST
═══════════════════════════════ */
.single-post .site-content,
.single .site-content,
body.single {
  background: var(--bg) !important;
}

.single .entry-header,
.post-header {
  padding: 48px 0 40px !important;
  border-bottom: 1px solid var(--border) !important;
  margin-bottom: 48px !important;
}

.single .entry-title,
.single h1.entry-title {
  font-family: var(--font-serif) !important;
  font-optical-sizing: auto !important;
  font-size: clamp(2rem, 5vw, 3.2rem) !important;
  font-weight: 900 !important;
  line-height: 1.1 !important;
  color: var(--text-1) !important;
  letter-spacing: -0.03em !important;
  max-width: 16ch !important;
}

.entry-content {
  font-family: var(--font-sans) !important;
  font-size: 18px !important;
  line-height: 1.85 !important;
  color: var(--text-1) !important;
}

.entry-content h2 {
  font-family: var(--font-serif) !important;
  font-optical-sizing: auto !important;
  font-size: clamp(1.5rem, 3.5vw, 2rem) !important;
  font-weight: 700 !important;
  color: var(--gold) !important;
  margin-top: 2.5em !important;
  margin-bottom: 0.75em !important;
  letter-spacing: -0.02em !important;
}

.entry-content h3 {
  font-family: var(--font-serif) !important;
  font-optical-sizing: auto !important;
  font-size: 1.35rem !important;
  font-weight: 700 !important;
  color: var(--text-1) !important;
  margin-top: 2em !important;
}

.entry-content strong {
  color: var(--text-1) !important;
  font-weight: 700 !important;
}

.entry-content blockquote {
  border-left: 3px solid var(--gold) !important;
  padding: 20px 28px !important;
  background: var(--bg-lift) !important;
  border-radius: 0 var(--radius) var(--radius) 0 !important;
  margin: 2.5em 0 !important;
  font-family: var(--font-serif) !important;
  font-style: italic !important;
  font-size: 1.15rem !important;
  color: var(--gold) !important;
}

.entry-content ul,
.entry-content ol {
  padding-left: 1.5em !important;
  margin-bottom: 1.5em !important;
}

.entry-content li {
  margin-bottom: 0.6em !important;
  line-height: 1.75 !important;
}

/* Sthenics sign-off */
.sthenics-sign-off {
  font-family: var(--font-serif) !important;
  font-style: italic !important;
  font-size: 1.1rem !important;
  color: var(--gold) !important;
  line-height: 1.65 !important;
  margin-top: 56px !important;
  padding-top: 32px !important;
  border-top: 1px solid var(--border) !important;
}

/* ═══════════════════════════════
   FOOTER
═══════════════════════════════ */
footer,
.ct-footer,
.site-footer,
#colophon,
[data-id="footer"],
.ct-footer-builder,
.ct-footer-builder > *,
.ct-footer-builder > * > * {
  background: var(--bg-warm) !important;
  background-color: var(--bg-warm) !important;
  border-top: 1px solid var(--border) !important;
  color: var(--text-3) !important;
}

.ct-footer a,
.site-footer a,
footer a {
  color: var(--text-3) !important;
  font-size: 13px !important;
  text-decoration: none !important;
}

.ct-footer a:hover,
footer a:hover {
  color: var(--cyan) !important;
}

/* ═══════════════════════════════
   BUTTONS
═══════════════════════════════ */
.wp-block-button__link,
a.button,
.btn-primary,
input[type="submit"] {
  background: var(--cyan) !important;
  color: var(--bg) !important;
  font-family: var(--font-sans) !important;
  font-weight: 700 !important;
  font-size: 14px !important;
  letter-spacing: 0.04em !important;
  padding: 14px 28px !important;
  border-radius: var(--radius) !important;
  border: none !important;
  text-decoration: none !important;
  transition: opacity 0.2s !important;
}

.wp-block-button__link:hover {
  opacity: 0.85 !important;
}

/* ═══════════════════════════════
   WIDGETS + SIDEBAR
═══════════════════════════════ */
.widget,
.widget-area,
.ct-sidebar,
aside {
  background: var(--bg-warm) !important;
}

.widget-title {
  font-family: var(--font-mono) !important;
  font-size: 11px !important;
  letter-spacing: 0.14em !important;
  text-transform: uppercase !important;
  color: var(--tiffany) !important;
  margin-bottom: 16px !important;
}

/* ═══════════════════════════════
   SEARCH
═══════════════════════════════ */
.ct-header .search-form input,
input[type="search"] {
  background: var(--bg-lift) !important;
  border: 1px solid var(--border-hi) !important;
  color: var(--text-1) !important;
  border-radius: var(--radius) !important;
  font-family: var(--font-sans) !important;
  font-size: 15px !important;
  padding: 10px 16px !important;
}

/* ═══════════════════════════════
   PAGINATION
═══════════════════════════════ */
.page-numbers,
.ct-pagination a,
nav.pagination a {
  font-family: var(--font-mono) !important;
  font-size: 13px !important;
  color: var(--text-2) !important;
  background: var(--bg-card) !important;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius) !important;
  padding: 8px 14px !important;
  text-decoration: none !important;
  transition: all 0.2s !important;
}

.page-numbers.current,
.ct-pagination .current {
  background: var(--cyan) !important;
  color: var(--bg) !important;
  border-color: var(--cyan) !important;
}

/* ═══════════════════════════════
   ANIMATIONS
═══════════════════════════════ */
@keyframes fadeUp {
  from { opacity: 0; transform: translateY(14px); }
  to   { opacity: 1; transform: translateY(0); }
}

article { animation: fadeUp 0.5s ease both; }
article:nth-child(2) { animation-delay: 0.08s; }
article:nth-child(3) { animation-delay: 0.14s; }

/* ═══════════════════════════════
   MOBILE — 50+ accessible
═══════════════════════════════ */
@media (max-width: 768px) {
  body { font-size: 17px !important; }

  .ct-post-card .ct-post-content,
  .entry-summary { padding: 20px 22px !important; }

  .ct-menu > li > a,
  nav a { font-size: 12px !important; padding: 0 10px !important; }

  article { margin-bottom: 16px !important; }
}

.ct-site-title,
.site-title {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
  clip: rect(0,0,0,0) !important;
  white-space: nowrap !important;
}