/*
Theme Name: Astra Child
Template: astra
Description: Child theme for medicalmalpracticelawyersaz.com (Arizona Medical Malpractice Resource Center). Portfolio lrc- skin with this site's palette.
Version: 2.0.0
*/

/* ============================================================================
   lrc- PORTFOLIO SKIN  -  the design layer every Wilder West Assets site shares.
   This is what makes lrc-byline / lrc-lede / lrc-cta-card / lrc-btn render as the
   branded design instead of plain text. It belongs in the SKELETON so every clone
   inherits it (see admin/site-launch-playbook.md).

   PER-SITE: change only the four color/description tokens in :root below.
   Everything else is shared. Current values = medicalmalpracticelawyersaz.com (plum + copper, Libre Baskerville + Source Sans 3). Provisional palette, tokens only.

   Install (given the Customizer "spins forever" gotcha): paste this whole file into
   the Astra CHILD theme stylesheet - Appearance to Theme File Editor to Stylesheet
   (style.css) - or /wp-content/themes/<astra-child>/style.css. Once the Customizer
   is unstuck (playbook Step E2), Appearance to Customize to Additional CSS also works.
   ============================================================================ */

/* ---- PER-SITE BLOCK: edit ONLY this. Sites should look DISTINCT (own palette +
   own font pairing) so the portfolio reads as independent brands, not clones -
   while sharing the identical lrc- structure below. Swap the @import + the tokens.

   PRESETS (paste the matching set per site):
   • azdisabilitylawyer.com - institutional / steady
       @import Merriweather + PT Sans
       --lrc-primary:#2c4a6e; --lrc-accent:#d9912a; --lrc-accent-dark:#b9781d;
   • arizonataxrelief.com - trust / money / calm
       @import Lora + Source Sans 3
       --lrc-primary:#1f5e4b; --lrc-accent:#c8912b; --lrc-accent-dark:#a9781f;
   • arizonaduilaws.com - serious / decisive (urgency allowed)
       @import Roboto Slab + Roboto
       --lrc-primary:#17263a; --lrc-accent:#b23b2e; --lrc-accent-dark:#8f2c22;
   ------------------------------------------------------------------------------ */
@import url('https://fonts.googleapis.com/css2?family=Libre+Baskerville:wght@400;700&family=Source+Sans+3:wght@400;600;700&display=swap');

:root {
  /* colors */
  --lrc-primary: #4a2c5e;   /* headings, links, primary chrome */
  --lrc-accent:  #d08a2e;   /* CTAs, highlights */
  --lrc-accent-dark: #a96d1c; /* accent hover */
  --lrc-bg:      #f6f3f8;   /* soft page-background tint */
  --lrc-ink:     #231f2e;   /* body/dark text (keep AA on accent + white) */
  --lrc-muted:   #62586e;   /* bylines, captions */
  /* fonts - swap the pairing per site (and the @import above to match) */
  --lrc-font-head: 'Libre Baskerville', Georgia, 'Times New Roman', serif;
  --lrc-font-body: 'Source Sans 3', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;
  /* shape - nudge per site for extra distinction if you want (e.g. 4px vs 10px) */
  --lrc-radius: 8px;
}

/* ---- Typography (institutional: serif headings, humanist body) ---- */
body,
.entry-content,
.ast-container { font-family: var(--lrc-font-body); color: var(--lrc-ink); }

.entry-content h1, .entry-content h2, .entry-content h3, .entry-content h4,
h1.entry-title, .site-title {
  font-family: var(--lrc-font-head);
  color: var(--lrc-primary);
  line-height: 1.25;
}
.entry-content h2 { margin-top: 1.8em; }
.entry-content a { color: var(--lrc-primary); text-decoration: underline; }
.entry-content a:hover { color: var(--lrc-accent-dark); }

/* ---- Byline ---- */
.lrc-byline {
  font-size: 0.9rem; color: var(--lrc-muted); margin: 0 0 1.4em 0;
  padding-bottom: 0.9em; border-bottom: 1px solid #e2e8f0;
}
.lrc-byline a { color: var(--lrc-primary); font-weight: 700; }

/* ---- Lede (intro paragraph) ---- */
.lrc-lede { font-size: 1.2rem; line-height: 1.6; color: #33475b; margin: 0 0 1.4em 0; }

/* ---- Eyebrow / footnote helpers ---- */
.lrc-eyebrow { text-transform: uppercase; letter-spacing: .06em; font-size: .78rem; font-weight: 700; color: var(--lrc-accent-dark); }
.lrc-footnote { font-size: .82rem; color: var(--lrc-muted); }

/* ---- Short disclosure box (top-of-page) ---- */
.lrc-disclosure {
  background: var(--lrc-bg); border-left: 4px solid var(--lrc-primary);
  padding: 14px 18px; margin: 0 0 1.6em 0; border-radius: 4px;
}
.lrc-disclosure p { margin: 0; font-size: 0.92rem; color: #3a4a5a; }

/* ---- CTA card (the amber conversion box) ---- */
.lrc-cta-card {
  background: #fdf6ec; border: 1px solid #f0dcbf; border-top: 4px solid var(--lrc-accent);
  border-radius: 10px; padding: 26px 24px; margin: 32px 0; text-align: center;
}
.lrc-cta-card h3 { font-family: var(--lrc-font-head); color: var(--lrc-primary); margin: 0 0 8px 0; font-size: 1.3rem; }
.lrc-cta-card p  { margin: 0 auto 18px auto; max-width: 640px; color: #3a4a5a; }

/* ---- Buttons ---- */
.lrc-btn {
  display: inline-block; padding: 13px 26px; margin: 6px 6px 0 6px; border-radius: 7px;
  font-weight: 700; text-decoration: none !important; letter-spacing: .02em; line-height: 1;
  transition: background .15s ease, color .15s ease, box-shadow .15s ease;
}
.lrc-btn-solid { background: var(--lrc-accent); color: var(--lrc-ink) !important; }
.lrc-btn-solid:hover { background: var(--lrc-accent-dark); color: #fff !important; }
.lrc-btn-ghost { background: transparent; color: var(--lrc-primary) !important; border: 2px solid var(--lrc-primary); padding: 11px 24px; }
.lrc-btn-ghost:hover { background: var(--lrc-primary); color: #fff !important; }

/* ---- Inline CTA + FAQ helpers ---- */
.lrc-cta-inline { font-weight: 700; }
.lrc-faq h3 { color: var(--lrc-primary); margin-bottom: .2em; }

/* ---- Announcement bar (if rendered via a .lrc-announce element in header) ---- */
.lrc-announce { background: var(--lrc-primary); color: #fff; text-align: center; padding: 10px 16px; font-size: .95rem; }
.lrc-announce a { color: #f0b34a; text-decoration: none; font-weight: 700; }

/* ============================================================================
   HEADER / PRIMARY NAV  -  keeps the menu on ONE row and the brand from crowding
   it (fixes the two-row header wrap). Astra classes.
   ============================================================================ */

/* Shrink the long serif brand so the nav fits beside it on one line */
.ast-primary-header-bar .site-title,
.site-header .site-title { font-size: 1.3rem !important; line-height: 1.2; }
.ast-primary-header-bar .site-title a { color: var(--lrc-primary); }

/* Primary menu: single line, tighter spacing/size so all items fit */
.ast-nav-menu { flex-wrap: nowrap !important; }
.ast-nav-menu > .menu-item > a {
  padding: 0 13px !important;
  font-size: 0.95rem !important;
  font-family: var(--lrc-font-body);
}

/* "Free Case Review" as an amber BUTTON.
   In Appearance to Menus, add the CSS class  menu-cta  to that one menu item
   (enable the CSS Classes field via Screen Options first). */
.ast-nav-menu .menu-item.menu-cta > a {
  background: var(--lrc-accent);
  color: var(--lrc-ink) !important;
  border-radius: 7px;
  font-weight: 700;
  padding: 8px 18px !important;
  margin-left: 8px;
}
.ast-nav-menu .menu-item.menu-cta > a:hover { background: var(--lrc-accent-dark); color: #fff !important; }

/* Small screens: let the menu collapse normally (Astra's mobile toggle handles it) */
@media (max-width: 921px) {
  .ast-nav-menu { flex-wrap: wrap !important; }
}