/*
Theme Name: Silver Leaf Agency
Theme URI: https://silverleafagency.com
Author: Silver Leaf Agency
Description: Block theme for Silver Leaf Agency. Paper ground, steel-blue hairline identity, Barlow Condensed display type, signal-red CTA. Square corners everywhere.
Requires at least: 6.5
Tested up to: 6.6
Requires PHP: 7.4
Version: 1.1.0
License: GPL-2.0-or-later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: silverleaf
*/

/* ---------- Tokens ---------- */
:root {
  --sl-ink: #1d2d3d;        /* dark steel field */
  --sl-paper: #f2f2f3;      /* paper ground */
  --sl-text: #1d1f20;       /* ink on light */
  --sl-accent: #5980a6;     /* the mark */
  --sl-accent-300: #b5d9fd; /* on dark grounds */
  --sl-accent-700: #416180; /* descriptor / quiet accents on light */
  --sl-cta: #b3352c;        /* signal red — primary CTA only */
  --sl-cta-deep: #8e2921;
  --sl-hair: rgba(29, 31, 32, 0.12);
  --sl-gutter: clamp(20px, 3.5vw, 44px);
  --sl-radius: 0;
}

/* ---------- Base ---------- */
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--sl-paper);
  color: var(--sl-text);
  font-family: "Barlow", system-ui, -apple-system, "Segoe UI", sans-serif;
  font-size: 17px;
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
}
* { box-sizing: border-box; }
img, svg, canvas { max-width: 100%; }

a { color: var(--sl-accent-700); text-decoration: none; }
a:hover, a:focus-visible { color: var(--sl-text); }
:focus-visible { outline: 2px solid var(--sl-accent-700); outline-offset: 3px; }

h1, h2, h3, h4 {
  font-family: "Barlow Condensed", "Barlow", sans-serif;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  margin: 0;
}

.sl-screen-reader-text {
  position: absolute !important;
  width: 1px; height: 1px;
  overflow: hidden; clip: rect(1px, 1px, 1px, 1px);
  white-space: nowrap;
}

.sl-skip-link {
  position: absolute; left: -9999px; top: 0; z-index: 99;
  background: var(--sl-ink); color: var(--sl-paper);
  padding: 10px 16px; font-size: 12px; letter-spacing: 0.2em; text-transform: uppercase;
}
.sl-skip-link:focus { left: 8px; top: 8px; }

/* ---------- Identity ---------- */
.sl-logo { display: flex; align-items: stretch; gap: 14px; }
.sl-logo__mark { width: 48px; height: 48px; flex: none; align-self: center; color: var(--sl-accent); }
.sl-logo__divider { width: 1px; background: rgba(29, 31, 32, 0.16); align-self: stretch; margin: 3px 0; }
.sl-logo__type { display: flex; flex-direction: column; justify-content: center; gap: 5px; }
.sl-logo__word {
  font-family: "Barlow Condensed", sans-serif; font-weight: 600;
  font-size: 28px; line-height: 0.88; letter-spacing: 0.03em; color: var(--sl-text);
  text-transform: uppercase;
}
.sl-logo__descriptor { display: flex; align-items: center; gap: 8px; font-size: 8.5px; letter-spacing: 0.44em; text-transform: uppercase; color: var(--sl-accent-700); }
.sl-logo__descriptor i { width: 6px; height: 6px; background: var(--sl-accent); }

/* ---------- Long-form / legal prose ---------- */
.sl-prose h2 {
  font-family: "Barlow Condensed", sans-serif; font-weight: 600;
  font-size: 24px; text-transform: uppercase; letter-spacing: 0.02em;
  margin: 44px 0 12px;
}
.sl-prose p { margin: 0 0 14px; font-size: 15px; line-height: 1.75; color: rgba(29, 31, 32, 0.82); text-wrap: pretty; }
.sl-prose ul { margin: 0 0 14px; padding-left: 22px; }
.sl-prose li { font-size: 15px; line-height: 1.7; color: rgba(29, 31, 32, 0.82); margin-bottom: 7px; }
.sl-prose strong { color: var(--sl-text); font-weight: 600; }
.sl-prose a { border-bottom: 1px solid rgba(65, 97, 128, 0.35); }