/* ===========================================================
   Pilar's calibrated palette — overrides v1 tokens.css
   Source: Pilar's swatch card (sent 6 June 2026)
     Band 1 — Brushed copper  #CB9385 (metallic, vertical grain)
     Band 2 — Blush            #BE908A
     Band 3 — Silver           #B8BEC3 (cooler than v1's #C3C3C3)
     Band 4 — Cream            #EBE3CE (warmer than v1's cream-2)

   Loaded AFTER v1's tokens.css + styles.css so these values win.
   =========================================================== */

:root {
  /* Pilar's calibrated brand colours */
  --blush:        #BE908A;
  --silver:       #B8BEC3;
  --cream-2:      #EBE3CE;

  /* New: brushed copper accent */
  --copper:       #CB9385;
  --copper-deep:  #B57E70;

  /* Hover state derived from new blush */
  --blush-light:  #D7AFA8;

  /* Section background alias */
  --cream-warm:   #EBE3CE;

  /* Rule colour tuned to warm palette */
  --rule:         rgba(42, 39, 35, 0.12);
}

/* Copper accent button (optional) */
.btn--copper {
  background: var(--copper);
  color: var(--bg);
  border-color: var(--copper);
}
.btn--copper:hover {
  background: var(--copper-deep);
  border-color: var(--copper-deep);
}
.divider--copper {
  background: var(--copper);
}

/* =================================================================
   HEADER brand — logo + "BY PILAR WORKMAN" inline (per Pilar 6 Jun)
   v1 stacks them with flex-direction: column; we flip to row.
   ================================================================= */
.site-header .brand {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  gap: 14px !important;
  text-decoration: none;
}
.site-header .brand-logo {
  display: block;
  width: 150px;                    /* Option 2 — Medium */
  height: auto;
  /* Native trademark colours - NO FILTER. */
}
.site-header .brand-tagline {
  font-family: var(--font-body);
  font-weight: 400;
  font-size: 12px !important;      /* Option 2 — Medium */
  letter-spacing: 0.30em !important;
  text-transform: uppercase;
  color: var(--ink-soft);
  white-space: nowrap;
  border-left: 1px solid rgba(42, 39, 35, 0.18);
  padding-left: 14px;
  line-height: 1;
  display: inline-block;
}

/* =================================================================
   FOOTER brand - logo + "BY PILAR WORKMAN" inline (per Pilar 6 Jun)
   Replaces v1's stacked text construction.
   ================================================================= */
.site-footer .footer-brand-block {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 16px;
  flex-wrap: nowrap;
}
.site-footer .footer-brand-logo {
  height: 38px;                    /* Option 2 — Medium */
  width: auto;
  max-width: 240px;
  flex-shrink: 0;
  /* Native trademark colours - NO FILTER. */
}
.site-footer .footer-brand-by {
  font-family: var(--font-body);
  font-weight: 400;
  font-size: 12px;                 /* Option 2 — Medium */
  letter-spacing: 0.30em;
  text-transform: uppercase;
  color: var(--walnut);
  white-space: nowrap;
  border-left: 1px solid rgba(42, 39, 35, 0.25);
  padding-left: 14px;
  line-height: 1;
}
.site-footer .footer-brand { display: none; }

/* =================================================================
   FOOTER — Option D · seamless cream with blush hairline rule
   Locked by Pilar 8 Jun 2026.
   v1's dark footer is overridden here. The footer reads as a quiet
   continuation of the page; the only visual marker is the blush rule
   at the top of the footer.
   ================================================================= */
.site-footer {
  background: var(--bg) !important;          /* same cream as the page */
  color: var(--ink) !important;
  border-top: 1px solid var(--blush);        /* the blush hairline rule */
  padding-top: var(--space-7, 64px);
}
.site-footer .container {
  /* spacing above the grid so the rule has breathing room */
  padding-top: 8px;
}
.site-footer .footer-tag,
.site-footer p {
  color: var(--walnut);
}
.site-footer .footer-heading {
  color: var(--blush);
  letter-spacing: 0.22em;
  text-transform: uppercase;
  font-weight: 500;
  font-size: 10px;
}
.site-footer ul li,
.site-footer ul li a {
  color: var(--ink);
}
.site-footer ul li a:hover {
  color: var(--blush);
}
.site-footer a {
  color: var(--ink);
}
.site-footer a:hover {
  color: var(--blush);
}
.site-footer .footer-bottom {
  border-top: 1px solid rgba(42, 39, 35, 0.12) !important;
  color: var(--ink-soft);
}
.site-footer .contact-line {
  color: var(--ink-soft);
}
.site-footer .contact-line a {
  color: var(--ink-soft);
}
.site-footer .socials a {
  color: var(--ink);
  border: 1px solid rgba(42, 39, 35, 0.25);
}
.site-footer .socials a:hover {
  border-color: var(--blush);
  color: var(--blush);
}
