/*
Theme Name:   ruthneale
Theme URI:    https://ruthneale.com
Description:  Custom child theme for ruthneale.com. Built on Kadence. Implements the
              Ruth Neale "Dusk Garden" brand identity: Fraunces display, Newsreader body,
              Nightfall / earth / garden palette on Bone. Author imprint site (books,
              about, newsletter). Forked from the house child-theme pattern.
Author:       Ruth Neale
Author URI:   https://ruthneale.com
Template:     kadence
Version:      1.0.2
Text Domain:  ruthneale
*/

/* ════════════════════════════════════════════════════════════════════
   BRAND TOKENS
   The Dusk Garden identity (see RuthNeale_Brand_Guidelines). Change a
   value here and it cascades across the whole site.
   ════════════════════════════════════════════════════════════════════ */

:root {
  /* Core palette */
  --rn-nightfall: #232838;   /* primary ink + dark surfaces            */
  --rn-earth:     #6F5236;   /* warm secondary                         */
  --rn-garden:    #586B36;   /* living-green secondary                 */
  --rn-lamplight: #E0A04E;   /* warm accent / hinge — CTAs, accents    */
  --rn-bone:      #EEE8DC;   /* primary light ground                   */

  /* Accent + support */
  --rn-tomato:    #9F4138;   /* single sharp pop — sparing use only    */
  --rn-wheat:     #D9C8A2;   /* warm pale — text on Nightfall          */

  /* Derived */
  --rn-lamplight-deep: #CC8C3C;  /* button hover                       */
  --rn-hairline: rgba(35, 40, 56, 0.16);

  /* Type */
  --rn-font-display: 'Fraunces', Georgia, 'Times New Roman', serif;
  --rn-font-body:    'Newsreader', Georgia, 'Times New Roman', serif;

  /* Structure */
  --rn-radius:    8px;
  --rn-measure:   720px;   /* reading column                          */
  --rn-container: 1100px;  /* site max width                          */
}

/* ════════════════════════════════════════════════════════════════════
   TYPOGRAPHY
   Two serifs only — Fraunces for display, Newsreader for reading.
   Titles are title-case, NOT uppercase (literary, not the cookbook
   small-caps treatment). See README deviation note.
   ════════════════════════════════════════════════════════════════════ */

body,
.entry-content {
  font-family: var(--rn-font-body);
  font-weight: 400;
  color: var(--rn-nightfall);
}

h1, h2, h3, h4,
.entry-title,
.site-title {
  font-family: var(--rn-font-display);
  font-weight: 600;
  letter-spacing: -0.01em;
  color: var(--rn-nightfall);
  line-height: 1.0;
}

/* H1: post + page titles */
.entry-title { font-size: 2.25rem; }

.entry-content h2 { font-size: 1.75rem; font-weight: 600; }
.entry-content h3 { font-size: 1.375rem; font-weight: 500;}

/* Body copy */
.entry-content p,
.entry-content li {
  font-family: var(--rn-font-body);
  font-weight: 400;
  font-size: 18px;
  line-height: 1.6;
  color: var(--rn-nightfall);
}

/* Reading measure for article bodies */
.entry-content { max-width: var(--rn-measure); }

/* Eyebrow / label — Newsreader, uppercase, tracked */
.rn-eyebrow {
  font-family: var(--rn-font-body);
  font-size: 0.75rem;
  font-weight: 500;
  letter-spacing: 0.13em;
  text-transform: uppercase;
  color: var(--rn-garden);
}

/* ════════════════════════════════════════════════════════════════════
   LINKS
   Body links use Tilled Earth for readable contrast on Bone.
   Lamplight is reserved for buttons/accents (low-contrast on Bone).
   ════════════════════════════════════════════════════════════════════ */

a {
  color: var(--rn-earth);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
  transition: color 0.2s;
}
a:hover { color: var(--rn-garden); }

/* ════════════════════════════════════════════════════════════════════
   SITE HEADER
   Wordmark in Fraunces; tagline a tracked Newsreader eyebrow.
   ════════════════════════════════════════════════════════════════════ */

body { background: var(--rn-bone); }

.site-header {
  background: var(--rn-bone);
  padding-bottom: 28px;
}

.entry-content,
.entry-header { margin-top: 32px; }

.site-branding .site-title a {
  font-family: var(--rn-font-display);
  font-weight: 600;
  font-size: 2.25rem;
  letter-spacing: 0.04em;
  text-transform: none;
  color: var(--rn-nightfall);
  text-decoration: none;
}

.site-description {
  font-family: var(--rn-font-body);
  font-weight: 500;
  font-size: 0.72rem;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  color: var(--rn-garden);
  margin-top: 8px;
}

/* ════════════════════════════════════════════════════════════════════
   PRIMARY NAVIGATION
   ════════════════════════════════════════════════════════════════════ */

.main-navigation .menu > li > a,
.site-header-item .menu-item > a {
  font-family: var(--rn-font-body);
  font-size: 0.78rem;
  font-weight: 500;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--rn-nightfall);
  text-decoration: none;
}
.main-navigation .menu > li > a:hover { color: var(--rn-earth); }

.sub-menu {
  background: var(--rn-bone);
  border: 1px solid var(--rn-hairline);
  box-shadow: 0 12px 32px rgba(35, 40, 56, 0.10);
}
.sub-menu li a {
  font-family: var(--rn-font-body);
  font-size: 0.72rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--rn-nightfall);
}
.sub-menu li a:hover { color: var(--rn-earth); }

/* ════════════════════════════════════════════════════════════════════
   BUTTONS / CALLS TO ACTION
   Lamplight ground, Nightfall text — the newsletter signup, buy links.
   Lamplight on Nightfall text is the high-contrast warm pairing.
   ════════════════════════════════════════════════════════════════════ */

.rn-button,
.wp-block-button__link,
.kb-button,
button[type="submit"],
input[type="submit"] {
  display: inline-block;
  font-family: var(--rn-font-body);
  font-size: 0.8rem;
  font-weight: 600;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  text-decoration: none;
  color: var(--rn-nightfall);
  background: var(--rn-lamplight);
  border: none;
  border-radius: var(--rn-radius);
  padding: 12px 26px;
  transition: background 0.2s;
}
.rn-button:hover,
.wp-block-button__link:hover,
button[type="submit"]:hover,
input[type="submit"]:hover {
  background: var(--rn-lamplight-deep);
  color: var(--rn-nightfall);
}

/* Quiet/secondary button: outline on Bone */
.rn-button--ghost {
  background: transparent;
  color: var(--rn-nightfall);
  border: 1px solid var(--rn-nightfall);
}
.rn-button--ghost:hover {
  background: var(--rn-nightfall);
  color: var(--rn-bone);
}

/* ════════════════════════════════════════════════════════════════════
   BOOKS
   The author-site analog of the recipe card. A cover grid + book panel.
   ════════════════════════════════════════════════════════════════════ */

.rn-books {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 40px;
  margin: 40px 0;
}

.rn-book { display: flex; flex-direction: column; gap: 16px; }

.rn-book-cover img {
  width: 100%;
  height: auto;
  border-radius: var(--rn-radius);
  box-shadow: 0 14px 30px rgba(35, 40, 56, 0.18);
  border: none;
}

.rn-book-title {
  font-family: var(--rn-font-display);
  font-weight: 600;
  font-size: 1.4rem;
  color: var(--rn-nightfall);
  margin: 0;
}

.rn-book-blurb {
  font-family: var(--rn-font-body);
  font-size: 0.95rem;
  line-height: 1.55;
  color: var(--rn-nightfall);
  margin: 0;
}

.rn-book-buylinks { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 4px; }

/* ════════════════════════════════════════════════════════════════════
   REVIEW PULL-QUOTE  (blockquote)
   For praise / blurbs. Fraunces, italic, Tilled Earth rule.
   ════════════════════════════════════════════════════════════════════ */

blockquote {
  border-left: 3px solid var(--rn-earth);
  padding-left: 24px;
  margin: 36px 0;
  color: var(--rn-nightfall);
}
blockquote p {
  font-family: var(--rn-font-display) !important;
  font-size: 1.25rem !important;
  font-style: italic !important;
  font-weight: 400 !important;
  line-height: 1.5 !important;
}
blockquote cite {
  display: block;
  margin-top: 10px;
  font-family: var(--rn-font-body);
  font-style: normal;
  font-size: 0.75rem;
  letter-spacing: 0.13em;
  text-transform: uppercase;
  color: var(--rn-earth);
}

/* Drop cap — opens an About page or a sample chapter */
.has-drop-cap:first-letter {
  font-family: var(--rn-font-display);
  color: var(--rn-earth);
  font-weight: 600;
}

/* ════════════════════════════════════════════════════════════════════
   IMAGES
   Quiet, literary treatment — soft radius, no heavy frame. (Deviation
   from the house in-post image spec, which uses a black border; that's
   a different brand. See README.)
   ════════════════════════════════════════════════════════════════════ */

.entry-content img:not(.no-style):not(.wp-smiley):not(.emoji) {
  border-radius: var(--rn-radius);
  max-width: 100%;
  height: auto;
}

.entry-content figure,
.entry-content .wp-block-image,
.entry-content > img,
.entry-content p > img {
  margin-top: 40px;
  margin-bottom: 40px;
}

.entry-content figure img { margin-bottom: 0; }

.entry-content figcaption,
.entry-content .wp-element-caption,
.entry-content .wp-caption-text {
  margin-top: 10px;
  font-family: var(--rn-font-body);
  font-size: 0.9rem;
  font-style: italic;
  color: var(--rn-nightfall);
  opacity: 0.72;
  line-height: 1.5;
}


/* ════════════════════════════════════════════════════════════════════
   FOOTER  (rn-footer-*)
   Nightfall ground, Wheat text, Lamplight headings/hover. Author-site
   footer — brand blurb + a small nav. FIREWALL: no "also by", no
   cross-brand links, no shared social. Links here point inward only.
   ════════════════════════════════════════════════════════════════════ */

.site-footer {
  background: var(--rn-nightfall);
  color: var(--rn-wheat);
  padding: 56px 0;
}
.site-footer, .site-footer a {
  font-family: var(--rn-font-body);
  color: var(--rn-wheat);
}

.rn-footer-inner {
  max-width: var(--rn-container);
  margin: 0 auto;
  padding: 0 32px;
}

.rn-footer-columns {
  display: grid;
  grid-template-columns: 1.6fr 1fr 1fr;
  gap: 48px;
  margin-bottom: 44px;
}

.rn-footer-brand { display: flex; flex-direction: column; gap: 16px; }

.rn-footer-wordmark {
  font-family: var(--rn-font-display);
  font-weight: 600;
  font-size: 1.5rem;
  letter-spacing: 0.04em;
  color: var(--rn-bone);
}

.rn-footer-blurb {
  font-size: 0.82rem;
  font-weight: 400;
  line-height: 1.65;
  color: var(--rn-wheat);
  max-width: 34ch;
  margin: 0;
}

.rn-footer-col { display: flex; flex-direction: column; }

.rn-footer-col h4,
.rn-footer-col .rn-footer-col-heading {
  font-family: var(--rn-font-display);
  font-size: 0.8rem;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--rn-lamplight);
  margin: 0 0 16px 0;
}

.rn-footer-col ul { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 10px; }
.rn-footer-col li { margin: 0; padding: 0; list-style: none; }

.rn-footer-col a {
  font-size: 0.78rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--rn-wheat);
  text-decoration: none;
  transition: color 0.2s;
}
.rn-footer-col a:hover { color: var(--rn-lamplight); }

.rn-footer-bottom {
  border-top: 1px solid rgba(238, 232, 220, 0.16);
  padding-top: 28px;
  text-align: center;
  font-size: 0.68rem;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--rn-wheat);
  opacity: 0.75;
}
.rn-footer-bottom a { color: var(--rn-wheat); text-decoration: none; }
.rn-footer-bottom a:hover { color: var(--rn-lamplight); }

/* ════════════════════════════════════════════════════════════════════
   MOBILE
   ════════════════════════════════════════════════════════════════════ */

@media (max-width: 900px) {
  .rn-footer-columns { grid-template-columns: 1fr 1fr; gap: 32px; }
  .rn-footer-brand { grid-column: 1 / -1; }
}

@media (max-width: 600px) {
  .entry-title { font-size: 1.9rem; }
  .rn-footer-inner { padding: 0 20px; }
  .rn-footer-columns { grid-template-columns: 1fr; gap: 32px; }
  .rn-footer-brand { grid-column: auto; align-items: center; text-align: center; }
  .rn-footer-col { text-align: center; align-items: center; }
}