/* ============================================================================
   Drysdale Blog — premium pass (2026-10-03)
   Loaded LAST from functions.php. Matches the offline boundary-line site
   (board1.css + board1-polish.css). Does not change titles, permalinks,
   body copy, or SEO tags. Not a deploy.
   Tokens: bg #14171a, surface #191d20, text #eef1f0, muted #a9b0b2,
   accent #1fa091. Light theme: html[data-theme="light"].
   Radius 3px. Motion: 150ms seat. Buttons: fill #1fa091, label #14171a.
   ============================================================================ */

@font-face {
  font-family: "Bricolage Grotesque";
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
  src: url("assets/fonts/bricolage-grotesque-var.woff2") format("woff2");
}
@font-face {
  font-family: "Newsreader";
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
  src: url("assets/fonts/newsreader-var.woff2") format("woff2");
}
@font-face {
  font-family: "Newsreader";
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url("assets/fonts/newsreader-italic.woff2") format("woff2");
}
@font-face {
  font-family: "Bricolage Grotesque Fallback";
  src: local("Arial"), local("Helvetica Neue");
  size-adjust: 101.73%;
  ascent-override: 91.41%;
  descent-override: 26.54%;
  line-gap-override: 0%;
}
@font-face {
  font-family: "Newsreader Fallback";
  src: local("Georgia"), local("Times New Roman");
  size-adjust: 88.57%;
  ascent-override: 82.99%;
  descent-override: 29.92%;
  line-gap-override: 0%;
}

:root,
:root[data-theme="dark"],
html {
  --font-display: "Bricolage Grotesque", "Bricolage Grotesque Fallback", "Helvetica Neue", Arial, sans-serif;
  --font-body: "Newsreader", "Newsreader Fallback", Georgia, "Times New Roman", serif;
  --color-bg: #14171a;
  --color-surface: #191d20;
  --color-surface-offset: #1e2225;
  --color-surface-2: #1e2225;
  --color-divider: #2b2f33;
  --color-border: #383d41;
  --color-text: #eef1f0;
  --color-text-muted: #a9b0b2;
  --color-text-faint: #a9b0b2; /* readable muted, not tiny grey */
  --color-text-inverse: #14171a;
  --color-accent: #1fa091;
  --color-accent-fill: #1fa091;
  --color-accent-hover: #34b3a3;
  --color-accent-light: #16302c;
  --color-primary: #1fa091;
  --color-primary-hover: #34b3a3;
  --color-primary-active: #178476;
  --color-primary-light: #16302c;
  --color-primary-subtle: #16302c;
  --color-gold: #a9b0b2;
  --radius-sm: 1px;
  --radius-md: 3px;
  --radius-lg: 3px;
  --radius-xl: 3px;
  --radius-2xl: 3px;
  --seat: cubic-bezier(0.72, 0, 0.28, 1);
  --draw: cubic-bezier(0.55, 0, 0.45, 1);
  --ease-out: var(--seat);
  --dur-ui: 150ms;
  --text-sm: 1rem;
  --text-xs: 1rem;
  --text-base: 1.1875rem;
  color-scheme: dark;
}

:root[data-theme="light"] {
  --color-bg: #f4f5f3;
  --color-surface: #eceeeb;
  --color-surface-offset: #e5e7e3;
  --color-surface-2: #e5e7e3;
  --color-divider: #dee0dc;
  --color-border: #d2d5d1;
  --color-text: #181b1d;
  --color-text-muted: #565b5d;
  --color-text-faint: #565b5d;
  --color-text-inverse: #14171a;
  --color-accent: #0f6b60;
  --color-accent-fill: #1fa091;
  --color-accent-hover: #0c554c;
  --color-accent-light: #dcebe8;
  --color-primary: #0f6b60;
  --color-primary-hover: #0c554c;
  --color-primary-active: #0a463f;
  --color-primary-light: #dcebe8;
  --color-primary-subtle: #dcebe8;
  --color-gold: #565b5d;
  color-scheme: light;
}

html { background: var(--color-bg) !important; }

body,
body.wp-theme-drysdale-blog,
body.single,
body.archive,
body.search,
body.error404,
body.home,
body.page,
body.blog {
  font-family: var(--font-body) !important;
  font-size: 1.1875rem !important;
  line-height: 1.7 !important;
  letter-spacing: 0.005em;
  background: var(--color-bg) !important;
  color: var(--color-text) !important;
}

h1, h2, h3, h4, .blog-hero-title, .blog-card-title, .section-title, .footer-heading {
  font-family: var(--font-display) !important;
  letter-spacing: -0.015em;
  font-weight: 700;
  color: var(--color-text);
}

/* Dimension margin — same set-out edge as the static site */
@media (min-width: 900px) {
  body {
    --dim-margin: 56px;
    padding-left: var(--dim-margin);
  }
  body::before {
    content: "";
    position: fixed;
    top: 0;
    bottom: 0;
    left: calc(var(--dim-margin) - 1px);
    width: 1px;
    background: var(--color-border);
    z-index: 80;
    pointer-events: none;
  }
}

/* Header — glass, hairline, no blue */
.site-header,
.site-header.scrolled,
body.single .site-header,
body.archive .site-header,
body.search .site-header,
body.error404 .site-header,
body.home .site-header,
body.page .site-header,
body.blog .site-header {
  background: color-mix(in srgb, var(--color-bg) 78%, transparent) !important;
  border-bottom: 1px solid var(--color-border) !important;
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.28) !important;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}
@supports not ((backdrop-filter: blur(12px)) or (-webkit-backdrop-filter: blur(12px))) {
  .site-header,
  .site-header.scrolled { background: var(--color-surface) !important; }
}
:root[data-theme="light"] .site-header,
:root[data-theme="light"] .site-header.scrolled {
  background: color-mix(in srgb, var(--color-bg) 88%, transparent) !important;
  box-shadow: 0 1px 2px rgba(40, 42, 38, 0.05), 0 8px 22px rgba(40, 42, 38, 0.06) !important;
}
.nav-link,
body.single .nav-link,
body.archive .nav-link,
body.search .nav-link,
body.error404 .nav-link,
body.home .nav-link,
body.page .nav-link,
body.blog .nav-link,
.mobile-nav .nav-link {
  color: var(--color-text-muted) !important;
  font-family: var(--font-body) !important;
  font-size: 1.0625rem !important;
}
.nav-link:hover,
.nav-link[aria-current="page"],
body.single .nav-link:hover,
body.blog .nav-link:hover,
body.page .nav-link:hover,
body.archive .nav-link:hover {
  color: var(--color-accent) !important;
}
.nav-link::after {
  height: 1px !important;
  background: var(--color-accent) !important;
  border-radius: 0 !important;
  transition: width 150ms var(--seat) !important;
}
.theme-toggle,
.mobile-menu-btn {
  border-radius: 3px !important;
  color: var(--color-text) !important;
}

/* Buttons — fill #1fa091, label #14171a, 1px (matches V2 board1), 150ms seat.
   !important beats header.php / shortcode inline gradients. */
.btn,
.btn-primary,
a.btn,
a.btn-primary,
.header-cta-desktop,
.header-actions .btn-primary,
.blog-cta-phone,
.df__searchform button,
.df__comments input[type="submit"],
.df__comments button[type="submit"],
#commentform #submit,
#submit,
.wp-block-button__link {
  border-radius: 1px !important; /* V2 board1: .btn = --radius-sm 1px */
  transition:
    transform 150ms var(--seat),
    background-color 150ms var(--seat),
    border-color 150ms var(--seat) !important;
}
.btn-primary,
a.btn-primary,
.header-cta-desktop,
.header-actions .btn-primary,
.blog-cta-phone,
.df__searchform button,
.df__comments input[type="submit"],
.df__comments button[type="submit"],
#commentform #submit,
#submit,
.df__pagination .current,
.wp-block-button__link {
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.5rem !important;
  padding: 0.72rem 1.15rem !important;
  background: #1fa091 !important;
  background-image: none !important;
  color: #14171a !important;
  border: 1px solid #178476 !important;
  box-shadow: none !important;
  filter: none !important;
  font-family: var(--font-display) !important;
  font-size: 1.0625rem !important;
  font-weight: 650 !important;
  line-height: 1.2 !important;
  letter-spacing: -0.01em !important;
  text-decoration: none !important;
  white-space: nowrap !important;
}
.btn-primary:hover,
a.btn-primary:hover,
.header-cta-desktop:hover,
.blog-cta-phone:hover,
.df__searchform button:hover,
.df__comments input[type="submit"]:hover,
#submit:hover,
.wp-block-button__link:hover {
  background: #34b3a3 !important;
  color: #14171a !important;
  transform: translateY(1px);
  filter: none !important;
}
:root[data-theme="light"] .btn-primary:hover,
:root[data-theme="light"] .blog-cta-phone:hover,
:root[data-theme="light"] .header-cta-desktop:hover {
  background: #178476 !important;
  color: #14171a !important;
}

a:focus-visible,
.btn:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible {
  outline: 2px solid var(--color-accent) !important;
  outline-offset: 2px;
}

/* Blog hero — graphite set-out, hairline boundary, no blue wash */
.blog-hero,
.blog-hero--image {
  background: var(--color-bg) !important;
  padding: calc(80px + 3.5rem) 0 3.5rem !important;
  border-bottom: 1px solid var(--color-divider);
}
.blog-hero__bg img {
  filter: grayscale(0.92) contrast(0.92) brightness(0.48) !important;
}
:root[data-theme="light"] .blog-hero__bg img {
  filter: grayscale(0.45) contrast(1.04) brightness(1.05) !important;
}
.blog-hero__overlay {
  background: linear-gradient(90deg,
    rgba(20, 23, 26, 0.94) 0%,
    rgba(20, 23, 26, 0.82) 46%,
    rgba(20, 23, 26, 0.55) 100%) !important;
}
:root[data-theme="light"] .blog-hero__overlay {
  background: linear-gradient(90deg,
    rgba(244, 245, 243, 0.97) 0%,
    rgba(244, 245, 243, 0.9) 42%,
    rgba(244, 245, 243, 0.55) 100%) !important;
}
.blog-hero__overlay::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: 0.05;
  background-image: url("assets/polish/grain-tile.svg");
  background-size: 180px 180px;
  mix-blend-mode: soft-light;
}
.blog-hero-inner {
  max-width: 40rem !important;
  text-align: left !important;
}
.blog-hero-inner > p {
  color: var(--color-text-muted) !important;
  font-size: 1.1875rem !important;
  line-height: 1.6 !important;
  max-width: 42ch;
}
.blog-hero-title {
  color: var(--color-text) !important;
  font-size: clamp(2rem, 1.4rem + 2.2vw, 2.9rem) !important;
  font-weight: 700 !important;
  line-height: 1.08 !important;
  position: relative;
  padding-bottom: 0.9rem;
  max-width: 22ch;
}
.blog-hero-title::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: min(220px, 70%);
  height: 11px;
  background:
    linear-gradient(var(--color-accent), var(--color-accent)) left 5px / 100% 1px no-repeat,
    linear-gradient(var(--color-accent), var(--color-accent)) left center / 1px 11px no-repeat,
    linear-gradient(var(--color-accent), var(--color-accent)) right center / 1px 11px no-repeat;
  pointer-events: none;
}
.blog-meta,
.blog-meta-item {
  color: var(--color-text-muted) !important;
  font-size: 1.0625rem !important;
}
.blog-category-tag,
.blog-card-meta .blog-category-tag,
.blog-meta .blog-category-tag {
  background: transparent !important;
  color: var(--color-accent) !important;
  border: 1px solid var(--color-border) !important;
  border-radius: 3px !important;
  padding: 0.2rem 0.55rem !important;
  font-size: 1rem !important;
  font-weight: 600 !important;
  letter-spacing: 0.06em !important;
  text-transform: none !important;
  text-decoration: none !important;
  backdrop-filter: none !important;
}

/* Readable article column for ages 60–80: ~65–70ch at 19px, muted not faint */
.blog-main { padding-block: 2.5rem 4rem; }
.blog-layout {
  max-width: 40rem !important;
  margin-inline: auto !important;
  padding-inline: 1.25rem;
}
/* Article column stays on the ground — glass is for objects, not the whole post */
.blog-article {
  position: relative;
  background: transparent;
  border: 0;
  border-radius: 0;
  padding: 0;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  box-shadow: none;
  min-width: 0;
}
.blog-article::before,
.blog-article::after { content: none; }
.blog-content,
.blog-content p,
.blog-content li {
  font-family: var(--font-body) !important;
  font-size: 1.1875rem !important;
  line-height: 1.75 !important;
  color: var(--color-text) !important;
}
.blog-content p { margin: 0 0 1.15em !important; }
.blog-content h2,
.blog-content h3,
.blog-content h4 {
  color: var(--color-text) !important;
  line-height: 1.25 !important;
  margin-top: 2.25rem !important;
  margin-bottom: 0.7rem !important;
}
.blog-content h2 {
  font-size: clamp(1.55rem, 1.3rem + 0.8vw, 1.9rem) !important;
  position: relative;
  padding-top: 0.85rem;
}
.blog-content h2::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 4.5rem;
  height: 1px;
  background: var(--color-accent);
}
.blog-content h3 { font-size: 1.35rem !important; color: var(--color-accent) !important; }
.blog-content a {
  color: var(--color-accent) !important;
  text-decoration: underline !important;
  text-decoration-thickness: 1px;
  text-underline-offset: 3px;
  text-decoration-color: color-mix(in srgb, var(--color-accent) 55%, transparent);
}
.blog-content a:hover { text-decoration-color: var(--color-accent); }
.blog-content strong { color: var(--color-text) !important; font-weight: 650; }
.blog-content ul,
.blog-content ol { margin: 0.6em 0 1.2em !important; padding-left: 1.35em; }
.blog-content li { margin: 0.4em 0 !important; }
.blog-content blockquote {
  border-left: 1px solid var(--color-accent) !important;
  border-radius: 3px !important;
  background: var(--color-surface) !important;
  color: var(--color-text) !important;
  padding: 1rem 1.15rem !important;
}
.blog-content img,
.wp-post-image {
  border-radius: 3px !important;
  max-width: 100%;
  height: auto;
}
/* Featured photo: hairline frame + corner ticks, ticks stay in the corners */
.blog-featured {
  position: relative;
  margin: 0 0 1.75rem;
  border: 1px solid color-mix(in srgb, var(--color-text) 16%, transparent);
  border-radius: 3px;
  overflow: hidden;
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.28);
  background: var(--color-surface);
}
.blog-featured img,
.blog-featured .wp-post-image {
  display: block;
  width: 100%;
  height: auto;
  margin: 0 !important;
  border-radius: 0 !important;
}
.blog-featured::before,
.blog-featured::after {
  content: "";
  position: absolute;
  width: 12px;
  height: 12px;
  z-index: 2;
  pointer-events: none;
  opacity: 0.85;
  filter: drop-shadow(0 0 1px rgba(20, 23, 26, 0.55));
}
.blog-featured::before {
  top: 8px;
  left: 8px;
  background:
    linear-gradient(var(--color-accent), var(--color-accent)) top left / 12px 1px no-repeat,
    linear-gradient(var(--color-accent), var(--color-accent)) top left / 1px 12px no-repeat;
}
.blog-featured::after {
  right: 8px;
  bottom: 8px;
  background:
    linear-gradient(var(--color-accent), var(--color-accent)) bottom right / 12px 1px no-repeat,
    linear-gradient(var(--color-accent), var(--color-accent)) bottom right / 1px 12px no-repeat;
}
.blog-featured .corner-ticks {
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 2;
}
.blog-featured .corner-ticks::before,
.blog-featured .corner-ticks::after {
  content: "";
  position: absolute;
  width: 12px;
  height: 12px;
  opacity: 0.78;
}
.blog-featured .corner-ticks::before {
  top: 8px; right: 8px;
  background:
    linear-gradient(var(--color-accent), var(--color-accent)) top right / 12px 1px no-repeat,
    linear-gradient(var(--color-accent), var(--color-accent)) top right / 1px 12px no-repeat;
}
.blog-featured .corner-ticks::after {
  bottom: 8px; left: 8px;
  background:
    linear-gradient(var(--color-accent), var(--color-accent)) bottom left / 12px 1px no-repeat,
    linear-gradient(var(--color-accent), var(--color-accent)) bottom left / 1px 12px no-repeat;
}

.blog-back-link,
.blog-filed-under,
.blog-related-all,
.blog-related a {
  color: var(--color-accent) !important;
  font-size: 1.0625rem !important;
  text-decoration-thickness: 1px;
}
.blog-filed-under { color: var(--color-text-muted) !important; }
.blog-related {
  margin-top: 2.75rem;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  border-top: 1px solid var(--color-divider);
  padding-top: 1.35rem !important;
}
.blog-related-title {
  color: var(--color-text) !important;
  font-size: 1.35rem !important;
  margin: 0 0 0.9rem !important;
}
.blog-related-list {
  list-style: none !important;
  margin: 0 0 1rem !important;
  padding: 0 !important;
  display: grid !important;
  gap: 0.7rem !important;
}
.blog-related-list li {
  position: relative;
  background: color-mix(in srgb, var(--color-bg) 72%, transparent);
  border: 1px solid var(--color-border);
  border-radius: 3px;
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.24);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}
.blog-related-list li::before,
.blog-related-list li::after {
  content: "";
  position: absolute;
  width: 12px;
  height: 12px;
  pointer-events: none;
}
.blog-related-list li::before {
  top: 8px; left: 8px;
  background:
    linear-gradient(var(--color-accent), var(--color-accent)) top left / 12px 1px no-repeat,
    linear-gradient(var(--color-accent), var(--color-accent)) top left / 1px 12px no-repeat;
}
.blog-related-list li::after {
  right: 8px; bottom: 8px;
  background:
    linear-gradient(var(--color-accent), var(--color-accent)) bottom right / 12px 1px no-repeat,
    linear-gradient(var(--color-accent), var(--color-accent)) bottom right / 1px 12px no-repeat;
}
.blog-related-list a {
  display: block;
  padding: 0.95rem 1.15rem 0.95rem 1.35rem;
  color: var(--color-text) !important;
  text-decoration: none !important;
  font-family: var(--font-display) !important;
  font-size: 1.125rem !important;
  line-height: 1.35 !important;
}
.blog-related-list a:hover { color: var(--color-accent) !important; text-decoration: none !important; }

/* Index / archive cards — glass, 3px, corner ticks, no lift */
.blog-index {
  display: grid !important;
  grid-template-columns: 1fr !important;
  gap: 1rem !important;
}
.blog-card {
  position: relative;
  background: color-mix(in srgb, var(--color-bg) 72%, transparent) !important;
  border: 1px solid var(--color-border) !important;
  border-radius: 3px !important;
  padding: 1.25rem 1.2rem !important;
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.24) !important;
  transform: none !important;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  transition: border-color 150ms var(--seat) !important;
}
@supports not ((backdrop-filter: blur(12px)) or (-webkit-backdrop-filter: blur(12px))) {
  .blog-card { background: var(--color-surface) !important; }
}
.blog-card:hover {
  border-color: var(--color-accent) !important;
  transform: none !important;
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.24) !important;
}
.blog-card::before,
.blog-card::after {
  content: "";
  position: absolute;
  width: 12px;
  height: 12px;
  pointer-events: none;
}
.blog-card::before {
  top: 8px;
  left: 8px;
  background:
    linear-gradient(var(--color-accent), var(--color-accent)) top left / 12px 1px no-repeat,
    linear-gradient(var(--color-accent), var(--color-accent)) top left / 1px 12px no-repeat;
}
.blog-card::after {
  right: 8px;
  bottom: 8px;
  background:
    linear-gradient(var(--color-accent), var(--color-accent)) bottom right / 12px 1px no-repeat,
    linear-gradient(var(--color-accent), var(--color-accent)) bottom right / 1px 12px no-repeat;
}
.blog-card-title { font-size: 1.35rem !important; margin-bottom: 0.55rem !important; }
.blog-card-title a,
.blog-card-title a:hover,
[data-theme="dark"] .blog-card-title a,
[data-theme="dark"] .blog-card-title a:hover {
  color: var(--color-text) !important;
  text-decoration: none !important;
}
.blog-card:hover .blog-card-title a { color: var(--color-accent) !important; }
.blog-card-excerpt {
  font-size: 1.125rem !important;
  line-height: 1.65 !important;
  color: var(--color-text-muted) !important;
}
.blog-card-meta,
.blog-card-meta span {
  font-size: 1rem !important;
  color: var(--color-text-muted) !important;
}

.blog-topics {
  position: relative;
  margin: 0 0 1.25rem;
  padding: 0.9rem 1rem 1rem;
  background: color-mix(in srgb, var(--color-bg) 72%, transparent);
  border: 1px solid var(--color-border);
  border-radius: 3px;
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.24);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}
.blog-topics-label {
  font-size: 1rem !important;
  color: var(--color-text-muted) !important;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.blog-topic-chip {
  border-radius: 3px !important;
  font-size: 1rem !important;
  color: var(--color-accent) !important;
  background: transparent !important;
  border: 1px solid var(--color-border) !important;
  transition: border-color 150ms var(--seat), color 150ms var(--seat) !important;
}
.blog-topic-chip.is-current,
.blog-topic-chip[aria-current="page"] {
  background: #1fa091 !important;
  color: #14171a !important;
  border-color: #1fa091 !important;
}

/* CTA band — graphite glass, teal rule, not the blue gradient */
.blog-cta {
  background: color-mix(in srgb, var(--color-bg) 72%, transparent) !important;
  background-image: none !important;
  color: var(--color-text) !important;
  border: 1px solid var(--color-border) !important;
  border-top: 1px solid var(--color-accent) !important;
  border-radius: 3px !important;
  text-align: left !important;
  position: relative;
  overflow: hidden;
  padding: 1.5rem 1.35rem !important;
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.24) !important;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}
.blog-cta::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: 0.045;
  background-image: url("assets/polish/grain-tile.svg");
  background-size: 180px 180px;
}
.blog-cta h2 { color: var(--color-text) !important; }
.blog-cta p { color: var(--color-text-muted) !important; font-size: 1.125rem !important; }

.df__pagination a,
.df__pagination span {
  border-radius: 3px !important;
  border-color: var(--color-border) !important;
  background: var(--color-surface) !important;
  color: var(--color-text) !important;
  font-size: 1.0625rem !important;
}
.df__pagination .current { color: #14171a !important; }

.df__searchform input[type="search"],
.df__comments input[type="text"],
.df__comments input[type="email"],
.df__comments input[type="url"],
.df__comments textarea,
.blog-content input,
.blog-content textarea {
  border-radius: 3px !important;
  border: 1px solid var(--color-border) !important;
  background: var(--color-surface) !important;
  color: var(--color-text) !important;
  font-family: var(--font-body) !important;
  font-size: 1.125rem !important;
}

.df__404 h1 { color: var(--color-accent) !important; font-family: var(--font-display) !important; }
.df__404 p,
.df__404 a { font-size: 1.1875rem !important; color: var(--color-text); }
.df__404 a { color: var(--color-accent) !important; }

.site-footer {
  background: var(--color-surface) !important;
  border-top: 1px solid var(--color-divider) !important;
  color: var(--color-text) !important;
}
.footer-heading { color: var(--color-text) !important; font-size: 1rem !important; letter-spacing: 0.12em !important; }
.footer-brand p,
.footer-links a,
.footer-copyright,
.site-footer li {
  font-size: 1.0625rem !important;
  color: var(--color-text-muted) !important;
  line-height: 1.55 !important;
}
.footer-links a:hover { color: var(--color-accent) !important; }
.footer-bottom { border-top: 1px solid var(--color-divider) !important; }

@media (prefers-reduced-motion: reduce) {
  .btn-primary:hover,
  .blog-cta-phone:hover,
  .header-cta-desktop:hover,
  .blog-card:hover { transform: none !important; }
  .nav-link::after { transition: none !important; }
}


/* ---------------------------------------------------------------------------
   1.2.0 — restrained glass objects, outline secondary, light panels
   --------------------------------------------------------------------------- */
:root[data-theme="light"] .blog-card,
:root[data-theme="light"] .blog-related-list li,
:root[data-theme="light"] .blog-cta,
:root[data-theme="light"] .blog-topics {
  background: color-mix(in srgb, #fbfbf9 82%, transparent) !important;
  box-shadow: 0 1px 2px rgba(40, 42, 38, 0.05), 0 8px 22px rgba(40, 42, 38, 0.07) !important;
}
:root[data-theme="light"] .blog-featured {
  box-shadow: 0 1px 2px rgba(40, 42, 38, 0.05), 0 10px 24px rgba(40, 42, 38, 0.08);
  border-color: var(--color-border);
}

/* Secondary controls are outline. The filled peg is the quote / current chip. */
.btn-secondary,
.btn-outline,
.btn-ghost,
.blog-back-link,
.blog-related-all,
.df__searchform button,
.df__pagination a {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 0.4rem !important;
  background: transparent !important;
  background-image: none !important;
  color: var(--color-text) !important;
  border: 1px solid var(--color-border) !important;
  border-radius: 3px !important;
  box-shadow: none !important;
  filter: none !important;
  font-family: var(--font-display) !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  padding: 0.5rem 0.85rem !important;
  line-height: 1.2 !important;
  transition: border-color 150ms var(--seat), color 150ms var(--seat), transform 150ms var(--seat) !important;
}
.blog-back-link { margin: 0 0 1.25rem; font-size: 1rem !important; }
.blog-related-all { margin-top: 0.15rem; font-size: 1rem !important; }
.btn-secondary:hover,
.btn-outline:hover,
.btn-ghost:hover,
.blog-back-link:hover,
.blog-related-all:hover,
.df__searchform button:hover,
.df__pagination a:hover {
  border-color: var(--color-accent) !important;
  color: var(--color-text) !important;
  background: transparent !important;
  transform: translateY(1px);
  filter: none !important;
}
.df__pagination .current {
  background: #1fa091 !important;
  color: #14171a !important;
  border-color: #178476 !important;
}

.theme-toggle,
.mobile-menu-btn {
  border: 1px solid transparent;
  background: transparent;
}
.theme-toggle:hover,
.mobile-menu-btn:hover {
  border-color: var(--color-border);
  background: transparent;
}

a:focus-visible,
.btn:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
.blog-card a:focus-visible,
.blog-related-list a:focus-visible,
.blog-back-link:focus-visible,
.blog-cta-phone:focus-visible,
.header-cta-desktop:focus-visible,
.df__searchform button:focus-visible,
.df__comments input:focus-visible,
.df__comments textarea:focus-visible,
#submit:focus-visible,
#commentform #submit:focus-visible {
  outline: 2px solid var(--color-accent) !important;
  outline-offset: 2px !important;
  box-shadow: none !important;
}

.blog-content,
.blog-layout,
.blog-article,
.site-footer,
.footer-links,
.footer-links a {
  overflow-wrap: break-word;
  min-width: 0;
}
.blog-content pre,
.blog-content table,
.blog-content img { max-width: 100%; }

@media (max-width: 899px) {
  /* beats .header-actions .btn-primary (0,2,0) */
  .header-actions .header-cta-desktop,
  .header-cta-desktop { display: none !important; }
  .header-logo img { height: 40px !important; width: auto !important; max-width: 46vw; }
  .header-inner { min-width: 0; }
  .header-actions { gap: 0.25rem; }
}

@media (prefers-reduced-motion: reduce) {
  .btn-secondary:hover,
  .btn-outline:hover,
  .btn-ghost:hover,
  .blog-back-link:hover,
  .blog-related-all:hover,
  .df__searchform button:hover,
  .df__pagination a:hover,
  .btn-primary:hover,
  .blog-cta-phone:hover,
  .header-cta-desktop:hover { transform: none !important; }
}