/*
Theme Name: YearnFree Child
Theme URI: https://yearnfree.com
Description: YearnFree 2026 Editorial Redesign - Child Theme for Astra
Author: YearnFree
Template: astra
Version: 1.0.0
*/

/* ============================================
   GOOGLE FONTS IMPORT
   ============================================ */
@import url('https://fonts.googleapis.com/css2?family=Libre+Baskerville:ital,wght@0,400;0,700;1,400&family=DM+Sans:ital,opsz,wght@0,9..40,300;0,9..40,400;0,9..40,500;0,9..40,600;1,9..40,300&display=swap');

/* ============================================
   CSS VARIABLES
   ============================================ */
:root {
  --yf-parchment: #F9F9F5;
  --yf-ink: #1A1A18;
  --yf-accent: #C8602A;
  --yf-muted: #888880;
  --yf-border: #D0CEC5;
  --yf-surface: #F0EDE5;
  --yf-font-serif: 'Libre Baskerville', Georgia, serif;
  --yf-font-sans: 'DM Sans', system-ui, sans-serif;
}

/* ============================================
   GLOBAL RESETS & BASE
   ============================================ */
body {
  background-color: var(--yf-parchment) !important;
  font-family: var(--yf-font-sans) !important;
  color: var(--yf-ink) !important;
}

/* ============================================
   TYPOGRAPHY
   ============================================ */
h1, h2, h3, h4, h5, h6,
.entry-title,
.ast-blog-single-element.ast-blog-post-title {
  font-family: var(--yf-font-serif) !important;
  color: var(--yf-ink) !important;
  letter-spacing: -0.3px;
}

h1 { font-size: 2.2rem !important; line-height: 1.2 !important; }
h2 { font-size: 1.7rem !important; line-height: 1.25 !important; }
h3 { font-size: 1.35rem !important; line-height: 1.3 !important; }

p, li, td, th, blockquote {
  font-family: var(--yf-font-sans) !important;
  line-height: 1.75 !important;
  color: var(--yf-ink) !important;
}

.entry-content p {
  font-family: var(--yf-font-serif) !important;
  font-size: 1.05rem !important;
  line-height: 1.85 !important;
  color: #333330 !important;
}

blockquote,
.wp-block-quote {
  font-family: var(--yf-font-serif) !important;
  font-style: italic !important;
  border-left: 3px solid var(--yf-accent) !important;
  background: var(--yf-surface) !important;
  padding: 1.25rem 1.5rem !important;
  color: #444440 !important;
}

a {
  color: var(--yf-ink) !important;
  text-decoration: none !important;
  transition: color 0.15s ease !important;
}

a:hover {
  color: var(--yf-accent) !important;
}

/* ============================================
   NAVIGATION
   ============================================ */
.ast-primary-header-bar,
#masthead,
.site-header {
  background-color: var(--yf-parchment) !important;
  border-bottom: 1.5px solid var(--yf-ink) !important;
  box-shadow: none !important;
}

.main-header-menu .menu-item > a,
.ast-header-break-point .main-header-menu .menu-item > a {
  font-family: var(--yf-font-sans) !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.08em !important;
  color: var(--yf-ink) !important;
}

.main-header-menu .menu-item > a:hover {
  color: var(--yf-accent) !important;
}

/* Subscribe button in nav */
.ast-header-custom-item .ast-custom-button,
.menu-item.subscribe-btn > a {
  background-color: var(--yf-ink) !important;
  color: var(--yf-parchment) !important;
  padding: 8px 18px !important;
  border-radius: 2px !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.06em !important;
}

.ast-header-custom-item .ast-custom-button:hover,
.menu-item.subscribe-btn > a:hover {
  background-color: var(--yf-accent) !important;
  color: #fff !important;
}

/* Site title */
.site-title a,
.ast-site-identity .site-title a {
  font-family: var(--yf-font-serif) !important;
  font-weight: 700 !important;
  font-size: 1.3rem !important;
  color: var(--yf-ink) !important;
  letter-spacing: -0.5px !important;
}

/* ============================================
   BLOG / ARCHIVE CARDS
   ============================================ */
.ast-article-post,
.ast-blog-post,
.post-grid-item {
  background: #ffffff !important;
  border: 1px solid var(--yf-border) !important;
  border-radius: 2px !important;
  transition: border-color 0.15s ease !important;
}

.ast-article-post:hover,
.ast-blog-post:hover {
  border-color: var(--yf-ink) !important;
}

.ast-blog-single-element.ast-blog-post-title a {
  font-family: var(--yf-font-serif) !important;
  font-weight: 700 !important;
  color: var(--yf-ink) !important;
  font-size: 1.2rem !important;
  line-height: 1.35 !important;
}

.ast-blog-single-element.ast-blog-post-title a:hover {
  color: var(--yf-accent) !important;
}

/* Category tags */
.ast-blog-single-element.ast-post-categories a,
.cat-links a,
.entry-meta .cat-links a {
  font-size: 10px !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.1em !important;
  color: var(--yf-accent) !important;
  border: 1px solid var(--yf-accent) !important;
  padding: 2px 7px !important;
  border-radius: 1px !important;
}

/* Post meta */
.ast-blog-single-element.ast-blog-date,
.entry-meta,
.posted-on,
.byline {
  font-size: 11px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.08em !important;
  color: var(--yf-muted) !important;
  font-family: var(--yf-font-sans) !important;
}

/* ============================================
   SINGLE POST
   ============================================ */
.single .entry-header {
  border-bottom: 1.5px solid var(--yf-ink) !important;
  padding-bottom: 1.5rem !important;
  margin-bottom: 2rem !important;
}

.single .entry-title {
  font-size: 2.4rem !important;
  line-height: 1.2 !important;
  margin-bottom: 1rem !important;
}

/* ============================================
   BUTTONS & CTA
   ============================================ */
.ast-btn,
.wp-block-button__link,
button[type="submit"],
input[type="submit"] {
  background-color: var(--yf-ink) !important;
  color: var(--yf-parchment) !important;
  font-family: var(--yf-font-sans) !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.06em !important;
  border-radius: 2px !important;
  border: none !important;
  padding: 10px 22px !important;
  transition: background-color 0.15s ease !important;
}

.ast-btn:hover,
.wp-block-button__link:hover,
button[type="submit"]:hover,
input[type="submit"]:hover {
  background-color: var(--yf-accent) !important;
  color: #fff !important;
}

/* ============================================
   FOOTER
   ============================================ */
.site-footer,
#colophon {
  background-color: var(--yf-parchment) !important;
  border-top: 1.5px solid var(--yf-ink) !important;
  color: var(--yf-muted) !important;
}

.site-footer a {
  color: var(--yf-muted) !important;
  font-size: 12px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.06em !important;
}

.site-footer a:hover {
  color: var(--yf-accent) !important;
}

/* ============================================
   SIDEBAR
   ============================================ */
.widget-title {
  font-family: var(--yf-font-sans) !important;
  font-size: 11px !important;
  text-transform: uppercase !important;
  letter-spacing: 0.14em !important;
  font-weight: 600 !important;
  border-bottom: 1.5px solid var(--yf-ink) !important;
  padding-bottom: 0.6rem !important;
  margin-bottom: 1rem !important;
}

/* ============================================
   PULL QUOTE UTILITY CLASS
   ============================================ */
.yf-pull-quote {
  border-top: 1.5px solid var(--yf-ink);
  border-bottom: 1.5px solid var(--yf-ink);
  padding: 2rem 3rem;
  text-align: center;
  margin: 2.5rem 0;
}

.yf-pull-quote p {
  font-family: var(--yf-font-serif) !important;
  font-size: 1.25rem !important;
  font-style: italic !important;
  line-height: 1.6 !important;
  color: var(--yf-ink) !important;
}

/* ============================================
   ELEMENTOR OVERRIDES
   ============================================ */
.elementor-widget-heading .elementor-heading-title {
  font-family: var(--yf-font-serif) !important;
}

.elementor-widget-text-editor {
  font-family: var(--yf-font-sans) !important;
}

/* ============================================
   UTILITY
   ============================================ */
.yf-category-tag {
  display: inline-block;
  font-size: 10px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  font-weight: 600;
  color: var(--yf-accent);
  border: 1px solid var(--yf-accent);
  padding: 2px 7px;
  border-radius: 1px;
  margin-bottom: 0.75rem;
}

hr, .wp-block-separator {
  border: none !important;
  border-top: 1px solid var(--yf-border) !important;
  margin: 2rem 0 !important;
}
