/*
Theme Name: Lactation Consultant Ed
Theme URI: https://lactationconsultanted.com
Description: Custom GeneratePress child theme for Lactation Consultant Ed. Navy + Copper brand system, Newsreader display / Inter body / Montserrat logo. Includes full-width landing templates for the Homepage, the IBCLC Biz Made Easy opt-in, and the $37 Marketing Guide sales page.
Author: Bri & Katie
Template: generatepress
Version: 1.0.0
Text Domain: lactation-consultant-ed
*/

/* ==========================================================================
   GLOBAL BRAND TOKENS
   Used by standard WordPress pages (blog, About, legal, etc.) so they inherit
   the brand automatically. The three landing templates are self-contained and
   carry their own scoped CSS for pixel fidelity.
   ========================================================================== */
:root {
  --navy: #2C3E50;
  --navy-deep: #233140;
  --copper: #C87C5A;
  --copper-deep: #B56847;
  --charcoal: #34495E;
  --slate: #95A5B8;
  --cream: #FAF8F5;
  --cream-warm: #F3EEE7;
}

/* ---- Base typography for standard (non-landing) pages ---- */
body {
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  color: var(--charcoal);
  background: var(--cream);
  -webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4,
.entry-title,
.widget-title {
  font-family: 'Newsreader', Georgia, serif;
  font-weight: 500;
  letter-spacing: -0.015em;
  color: var(--navy);
}

a { color: var(--copper-deep); }
a:hover { color: var(--copper); }

/* ---- Brand buttons reusable on standard pages ---- */
.button,
.wp-block-button__link,
button.wp-element-button {
  background: var(--copper);
  color: #fff;
  border-radius: 100px;
  font-weight: 600;
}
.button:hover,
.wp-block-button__link:hover {
  background: var(--copper-deep);
  color: #fff;
}

/* ---- Site logo helper (if used in the GeneratePress header on standard pages) ---- */
.lce-logo { font-family: 'Montserrat', sans-serif; color: var(--navy); line-height: 1.05; }
.lce-logo .top    { display: block; font-size: 18px; font-weight: 700; letter-spacing: 0.04em; text-transform: uppercase; }
.lce-logo .bottom { display: block; font-size: 18px; font-weight: 700; letter-spacing: 0.04em; text-transform: lowercase; }
.lce-logo .tagline{ display: block; font-size: 8px; font-weight: 500; letter-spacing: 0.22em; text-transform: uppercase; color: var(--copper-deep); margin-top: 3px; }

/* ==========================================================================
   STANDARD PAGES + BLOG (GeneratePress default layout)
   Brands the site header, blog archive, single posts, and content pages that
   use GeneratePress's normal header/footer (Blog, Privacy, Terms, etc.).
   Set the header logo + primary menu in Appearance → Customize / Menus.
   ========================================================================== */

/* Site header + primary navigation */
.site-header { background: var(--cream); }
.main-navigation,
.main-navigation ul { background: var(--cream); }
.main-navigation a { color: var(--charcoal); font-weight: 500; }
.main-navigation a:hover,
.main-navigation .current-menu-item > a { color: var(--copper-deep); }
/* Add the CSS class "nav-cta" to one menu item (Appearance → Menus → Screen Options
   → CSS Classes) to turn it into the copper button. */
.main-navigation .nav-cta > a { background: var(--copper); color: #fff; border-radius: 100px; }
.main-navigation .nav-cta > a:hover { background: var(--copper-deep); color: #fff; }

/* Titles + content typography */
.entry-header .entry-title,
.page-header .entry-title,
.entry-title a { font-family: 'Newsreader', serif; color: var(--navy); }
.entry-content { font-size: 17px; color: var(--charcoal); }
.entry-content h2 { font-family: 'Newsreader', serif; font-size: 28px; margin: 1.6em 0 .5em; color: var(--navy); }
.entry-content h3 { font-family: 'Newsreader', serif; font-size: 22px; margin: 1.4em 0 .4em; color: var(--navy); }
.entry-content a { color: var(--copper-deep); text-decoration: underline; }
.entry-content a:hover { color: var(--copper); }
.entry-content img,
.post-image img,
.wp-post-image { border-radius: 14px; }
.entry-content blockquote {
  border-left: 4px solid var(--copper); background: var(--cream-warm);
  margin: 1.4em 0; padding: 18px 24px; border-radius: 0 12px 12px 0;
  font-family: 'Newsreader', serif; font-style: italic; color: var(--navy);
}

/* Blog / archive / search post cards */
.blog .site-main .post,
.archive .site-main .post,
.search .site-main .post {
  background: #fff; border: 1px solid rgba(149,165,184,0.2); border-radius: 18px;
  padding: 32px 34px; margin-bottom: 28px; box-shadow: 0 14px 36px -28px rgba(44,62,80,0.3);
}
.blog .post-image img,
.archive .post-image img { border-radius: 12px; margin-bottom: 18px; }
.blog .entry-title a:hover,
.archive .entry-title a:hover { color: var(--copper-deep); }
.entry-meta { color: var(--slate); font-size: 13.5px; }
.read-more, .more-link {
  display: inline-block; margin-top: 8px; color: var(--copper-deep);
  font-weight: 600; text-decoration: none;
}
.read-more:hover, .more-link:hover { color: var(--copper); }

/* Footer widgets / site info */
.site-footer,
.footer-widgets,
.site-info { background: var(--navy-deep); color: var(--slate); }
.site-info { font-size: 13px; }
.footer-widgets a, .site-info a { color: var(--copper); }
.footer-widgets .widget-title { color: var(--cream); font-family: 'Montserrat', sans-serif; font-size: 13px; text-transform: uppercase; letter-spacing: 0.06em; }

/* Lead-magnet CTA auto-appended after every single blog post (see functions.php) */
.lce-post-cta {
  margin: 48px 0 8px; background: linear-gradient(150deg, var(--navy), var(--navy-deep));
  border-radius: 22px; padding: 42px 40px; text-align: center; position: relative; overflow: hidden;
}
.lce-post-cta::after {
  content: ''; position: absolute; top: -70px; right: -60px; width: 200px; height: 200px;
  border-radius: 50%; background: radial-gradient(circle, rgba(200,124,90,0.28), transparent 70%);
}
.lce-post-cta .cta-eyebrow { font-size: 12px; font-weight: 700; letter-spacing: 0.16em; text-transform: uppercase; color: var(--copper); margin-bottom: 12px; position: relative; z-index: 1; }
.lce-post-cta h3 { font-family: 'Newsreader', serif; font-weight: 500; font-size: 26px; color: var(--cream); margin-bottom: 12px; position: relative; z-index: 1; }
.lce-post-cta p { color: var(--slate); font-size: 16px; max-width: 460px; margin: 0 auto 24px; position: relative; z-index: 1; }
.lce-post-cta a.cta-btn { display: inline-block; background: var(--copper); color: #fff; text-decoration: none; padding: 15px 30px; border-radius: 100px; font-weight: 600; position: relative; z-index: 1; }
.lce-post-cta a.cta-btn:hover { background: var(--copper-deep); }
