/* Craft shared — parity systems for non-cinematic template families */

:root {
  --craft-text-body: #334155;
  --craft-text-muted: #64748b;
  --craft-text-label: #0f766e;
  --craft-header-h: 4rem;
  --craft-header-h-lg: 5rem;
}

.dark {
  --craft-page-bg: #020617;
  --craft-text-body: #cbd5e1;
  --craft-text-muted: #94a3b8;
  --craft-text-label: #5eead4;
}

.craft-text-body { color: var(--craft-text-body); }
.craft-text-muted { color: var(--craft-text-muted); }
.craft-text-label { color: var(--craft-text-label); }
.craft-scroll-mt { scroll-margin-top: calc(var(--craft-header-h) + 0.75rem); }
@media (min-width: 1024px) {
  .craft-scroll-mt { scroll-margin-top: calc(var(--craft-header-h-lg) + 0.75rem); }
}

/* Lenis (parity smooth scroll) */
html.lenis,
html.lenis body {
  height: auto;
}
html.lenis,
html.lenis.lenis-smooth {
  overflow-y: scroll !important;
  scroll-behavior: auto !important;
}
.lenis.lenis-smooth [data-lenis-prevent] {
  overscroll-behavior: contain;
}

/* Scroll reveals */
[data-animate] {
  opacity: 0;
  transform: translateY(26px);
  transition:
    opacity 0.7s cubic-bezier(0.22, 1, 0.36, 1),
    transform 0.7s cubic-bezier(0.22, 1, 0.36, 1);
}
[data-animate].in-view {
  opacity: 1;
  transform: none;
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  [data-animate] {
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
}

/* Focus / a11y */
.craft-focus-ring:focus-visible {
  outline: 2px solid var(--brand-500, #f97316);
  outline-offset: 2px;
}
a:focus-visible,
button:focus-visible {
  outline: 2px solid var(--brand-500, #f97316);
  outline-offset: 2px;
}

/* Mobile nav open lock */
body.craft-nav-open {
  overflow: hidden;
}
.craft-nav-scrim {
  position: fixed;
  inset: 0;
  background: rgb(2 6 23 / 0.55);
  z-index: 45;
}

/* Form fields */
.craft-field {
  width: 100%;
  border-radius: var(--craft-radius, 0.5rem);
  border: 1px solid rgb(203 213 225);
  background: #fff;
  padding: 0.75rem 1rem;
  transition: border-color 0.2s, box-shadow 0.2s;
}
.craft-field:focus {
  outline: none;
  border-color: var(--brand-500, #f97316);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--brand-500, #f97316) 35%, transparent);
}
.dark .craft-field {
  background: rgb(15 23 42);
  border-color: rgb(51 65 85);
  color: rgb(226 232 240);
}
.craft-form-card {
  border-radius: calc(var(--craft-radius, 0.5rem) + 0.25rem);
  background: color-mix(in srgb, #fff 92%, transparent);
  backdrop-filter: blur(12px);
  border: 1px solid rgb(226 232 240);
  box-shadow: 0 12px 40px -16px rgb(0 0 0 / 0.18);
}
.dark .craft-form-card {
  background: color-mix(in srgb, rgb(15 23 42) 88%, transparent);
  border-color: rgb(51 65 85);
}

/* Active nav non-color cue */
.craft-nav-link.is-active {
  box-shadow: inset 0 -2px 0 var(--brand-400, #fb923c);
  font-weight: 700;
}

/* Eyebrow */
.craft-section-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--brand-600, #ea580c);
}

/* Footer link focus */
.craft-footer-link:focus-visible {
  outline: 2px solid var(--brand-400, #fb923c);
  outline-offset: 3px;
  border-radius: 2px;
}

/* Density helpers */
body[data-density="compact"] .craft-section-pad {
  padding-top: 3rem;
  padding-bottom: 3rem;
}
body[data-density="roomy"] .craft-section-pad {
  padding-top: 4rem;
  padding-bottom: 4rem;
}

/* Card styles */
body[data-card="bordered"] .craft-card {
  border: 1px solid rgb(226 232 240);
  border-radius: var(--craft-radius);
}
body[data-card="soft"] .craft-card {
  border: none;
  box-shadow: 0 4px 24px -6px rgb(0 0 0 / 0.1);
  border-radius: calc(var(--craft-radius) + 0.25rem);
}
body[data-card="glass"] .craft-card {
  background: color-mix(in srgb, #fff 8%, transparent);
  backdrop-filter: blur(12px);
  border: 1px solid rgb(255 255 255 / 0.12);
}

/* Hero recipe layout hooks */
.craft-hero-split {
  display: grid;
  gap: 2rem;
}
@media (min-width: 1024px) {
  .craft-hero-split {
    grid-template-columns: 1.1fr 0.9fr;
    align-items: center;
  }
}

/* ── Design DNA chrome variants ───────────────────────────────────────── */

/* Card: lift */
body[data-card="lift"] .craft-card {
  border: 1px solid rgb(226 232 240 / 0.9);
  border-radius: var(--craft-radius);
  box-shadow: 0 10px 30px -12px rgb(0 0 0 / 0.18);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
body[data-card="lift"] .craft-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 16px 36px -14px rgb(0 0 0 / 0.22);
}

/* Nav styles */
body[data-nav="solid_dark"] .craft-site-header {
  background: rgb(15 23 42 / 0.96) !important;
  border-bottom-color: rgb(51 65 85) !important;
  color: #e2e8f0;
}
body[data-nav="solid_light"] .craft-site-header {
  background: #fff !important;
  backdrop-filter: none;
  border-bottom: 1px solid rgb(226 232 240);
}
body[data-nav="glass_light"] .craft-site-header {
  background: color-mix(in srgb, var(--craft-page-bg, #f4f3f1) 72%, transparent) !important;
  backdrop-filter: blur(16px);
}
body[data-nav="underline_minimal"] .craft-site-header {
  background: transparent !important;
  backdrop-filter: none;
  border-bottom: none !important;
  box-shadow: none !important;
}
body[data-nav="underline_minimal"] .craft-nav-link.is-active {
  background: transparent !important;
  box-shadow: inset 0 -2px 0 var(--brand-600, #ea580c);
}
body[data-nav="floating_bar"] .craft-site-header {
  top: 0.75rem;
  margin-inline: max(0.75rem, calc((100% - 80rem) / 2 + 0.75rem));
  max-width: 80rem;
  width: calc(100% - 1.5rem);
  border-radius: calc(var(--craft-radius, 0.5rem) + 0.5rem);
  border: 1px solid rgb(226 232 240 / 0.9) !important;
  box-shadow: 0 12px 40px -16px rgb(0 0 0 / 0.25);
}
/* Phone-forward: emphasize tel CTA, slim chrome */
body[data-nav="phone_forward"] .craft-site-header {
  background: rgb(15 23 42 / 0.97) !important;
  border-bottom-color: rgb(51 65 85) !important;
}
body[data-nav="phone_forward"] .craft-site-header .craft-nav-phone {
  display: inline-flex !important;
  align-items: center;
  gap: 0.5rem;
  font-weight: 700;
  font-size: 0.95rem;
  letter-spacing: 0.02em;
  color: #fff !important;
  background: var(--brand-600, #ea580c);
  padding: 0.55rem 1rem;
  border-radius: var(--craft-radius, 0.5rem);
}
body[data-nav="phone_forward"] .craft-site-header .craft-btn:not(.craft-nav-phone) {
  display: none;
}
body:not([data-nav="phone_forward"]) .craft-nav-phone {
  display: none !important;
}

/*
 * Dark-nav chrome contrast lock
 * ----------------------------
 * solid_dark / phone_forward paint a dark header even when the page is in
 * light mode. Template utilities still emit light-mode classes
 * (bg-brand-50, text-slate-600, hover:bg-brand-50, outline CTA cream hover).
 * Without this lock, DNA chrome CSS can force white text onto those cream
 * pills → blank/illegible active links, ghost icon wells, etc.
 *
 * Scope is .craft-header-bar only. .craft-mobile-panel stays theme-aware
 * (cream/dark drawer) and must NOT inherit dark-chrome link colors.
 *
 * Opt-in via body[data-nav-chrome="dark"] (set in base templates whenever
 * nav_style is a dark chrome recipe). Add new dark nav ids there too.
 */
body[data-nav-chrome="dark"] .craft-site-header {
  --craft-nav-fg: #f8fafc;
  --craft-nav-fg-muted: #94a3b8;
  --craft-nav-fg-active: var(--brand-300, #fdba74);
  --craft-nav-hover-bg: rgb(255 255 255 / 0.08);
  --craft-nav-active-bg: rgb(255 255 255 / 0.14);
  border-bottom-color: rgb(51 65 85) !important;
  color: var(--craft-nav-fg);
}

body[data-nav-chrome="dark"] .craft-header-bar .font-display {
  color: var(--craft-nav-fg) !important;
}
body[data-nav-chrome="dark"] .craft-header-bar a.group:hover .font-display {
  color: var(--craft-nav-fg-active) !important;
}
body[data-nav-chrome="dark"] .craft-header-bar .craft-trust-inline {
  color: var(--craft-nav-fg-muted) !important;
}

/* Nav links: neutralize light-mode active/hover utility paints */
body[data-nav-chrome="dark"] .craft-header-bar .craft-nav-link {
  color: var(--craft-nav-fg) !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none;
}
body[data-nav-chrome="dark"] .craft-header-bar .craft-nav-link:hover {
  background-color: var(--craft-nav-hover-bg) !important;
  color: #fff !important;
}
body[data-nav-chrome="dark"] .craft-header-bar .craft-nav-link.is-active {
  /* Solid brand-tint on navy — never cream utilities + forced white */
  background-image: none !important;
  background-color: color-mix(in srgb, var(--brand-500, #f97316) 28%, rgb(15 23 42)) !important;
  color: #fff !important;
  box-shadow: inset 0 -2px 0 var(--brand-400, #fb923c);
}

/* Theme toggle + hamburger (+ any future icon controls) */
body[data-nav-chrome="dark"] .craft-header-bar .craft-nav-icon-btn {
  color: var(--craft-nav-fg-muted) !important;
  background-color: transparent !important;
  background-image: none !important;
}
body[data-nav-chrome="dark"] .craft-header-bar .craft-nav-icon-btn:hover,
body[data-nav-chrome="dark"] .craft-header-bar .craft-nav-icon-btn:focus-visible {
  color: var(--craft-nav-fg-active) !important;
  background-color: var(--craft-nav-hover-bg) !important;
}

/* Filled CTAs / phone chip: always white label on brand fill */
body[data-nav-chrome="dark"] .craft-header-bar .craft-btn,
body[data-nav-chrome="dark"] .craft-header-bar .craft-nav-phone,
body[data-nav-chrome="dark"] .craft-header-bar .craft-nav-phone-mobile {
  color: #fff !important;
}

/* Outline button tone must not drop cream hover wells onto dark chrome.
   Scope to real CTAs only — never .craft-nav-link (services marks links craft-cta-radius). */
body[data-nav-chrome="dark"][data-btn="outline"] .craft-header-bar .craft-btn,
body[data-nav-chrome="dark"][data-btn="outline"] .craft-header-bar a.craft-btn,
body[data-nav-chrome="dark"][data-btn="outline"] .craft-header-bar .craft-nav-phone {
  background: transparent !important;
  color: var(--brand-300, #fdba74) !important;
  border: 2px solid var(--brand-400, #fb923c) !important;
  box-shadow: none !important;
}
body[data-nav-chrome="dark"][data-btn="outline"] .craft-header-bar .craft-btn:hover,
body[data-nav-chrome="dark"][data-btn="outline"] .craft-header-bar a.craft-btn:hover,
body[data-nav-chrome="dark"][data-btn="outline"] .craft-header-bar .craft-nav-phone:hover {
  background: var(--craft-nav-hover-bg) !important;
  color: #fff !important;
}

/* Mobile drawer is a separate light/dark panel — keep theme utilities readable.
   Never apply dark-chrome forced whites here (that made cream drawers illegible). */
body[data-nav-chrome="dark"] .craft-mobile-panel .craft-nav-link {
  /* reset any prior whole-header white-link rules */
  color: unset;
  background-color: unset;
  box-shadow: unset;
}
body[data-nav-chrome="dark"] .craft-mobile-panel .craft-nav-link.is-active {
  color: var(--brand-700, #c2410c) !important;
  background-color: var(--brand-50, #fff7ed) !important;
  box-shadow: inset 0 -2px 0 var(--brand-500, #f97316);
}
.dark body[data-nav-chrome="dark"] .craft-mobile-panel .craft-nav-link.is-active {
  color: var(--brand-300, #fdba74) !important;
  background-color: rgb(255 255 255 / 0.06) !important;
}

/*
 * Light-nav chrome contrast lock
 * -----------------------------
 * solid_light / glass_light force a light header even when <html class="dark">.
 * Template dark: utilities (dark:text-slate-300, dark:bg-white/5, outline brand-300)
 * would then paint pale text on white → illegible (mirror of the dark-chrome bug).
 * Lock header-bar to dark-on-light regardless of page theme.
 */
body[data-nav-chrome="light"] .craft-site-header {
  --craft-nav-fg: rgb(51 65 85);          /* slate-700 */
  --craft-nav-fg-muted: rgb(100 116 139); /* slate-500 */
  --craft-nav-fg-active: var(--brand-700, #c2410c);
  --craft-nav-hover-bg: var(--brand-50, #fff7ed);
  --craft-nav-active-bg: color-mix(in srgb, var(--brand-500, #f97316) 14%, #fff);
  color: var(--craft-nav-fg);
}

body[data-nav-chrome="light"] .craft-header-bar .font-display,
.dark body[data-nav-chrome="light"] .craft-header-bar .font-display {
  color: rgb(15 23 42) !important;
}
body[data-nav-chrome="light"] .craft-header-bar a.group:hover .font-display,
.dark body[data-nav-chrome="light"] .craft-header-bar a.group:hover .font-display {
  color: var(--craft-nav-fg-active) !important;
}
body[data-nav-chrome="light"] .craft-header-bar .craft-trust-inline,
.dark body[data-nav-chrome="light"] .craft-header-bar .craft-trust-inline {
  color: var(--craft-nav-fg-muted) !important;
}

body[data-nav-chrome="light"] .craft-header-bar .craft-nav-link,
.dark body[data-nav-chrome="light"] .craft-header-bar .craft-nav-link {
  color: var(--craft-nav-fg) !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none;
}
body[data-nav-chrome="light"] .craft-header-bar .craft-nav-link:hover,
.dark body[data-nav-chrome="light"] .craft-header-bar .craft-nav-link:hover {
  background-color: var(--craft-nav-hover-bg) !important;
  color: var(--craft-nav-fg-active) !important;
}
body[data-nav-chrome="light"] .craft-header-bar .craft-nav-link.is-active,
.dark body[data-nav-chrome="light"] .craft-header-bar .craft-nav-link.is-active {
  background-image: none !important;
  background-color: var(--craft-nav-active-bg) !important;
  color: var(--craft-nav-fg-active) !important;
  box-shadow: inset 0 -2px 0 var(--brand-600, #ea580c);
}

body[data-nav-chrome="light"] .craft-header-bar .craft-nav-icon-btn,
.dark body[data-nav-chrome="light"] .craft-header-bar .craft-nav-icon-btn {
  color: var(--craft-nav-fg-muted) !important;
  background-color: transparent !important;
  background-image: none !important;
}
body[data-nav-chrome="light"] .craft-header-bar .craft-nav-icon-btn:hover,
body[data-nav-chrome="light"] .craft-header-bar .craft-nav-icon-btn:focus-visible,
.dark body[data-nav-chrome="light"] .craft-header-bar .craft-nav-icon-btn:hover,
.dark body[data-nav-chrome="light"] .craft-header-bar .craft-nav-icon-btn:focus-visible {
  color: var(--craft-nav-fg-active) !important;
  background-color: var(--craft-nav-hover-bg) !important;
}

body[data-nav-chrome="light"] .craft-header-bar .craft-btn,
body[data-nav-chrome="light"] .craft-header-bar .craft-nav-phone,
body[data-nav-chrome="light"] .craft-header-bar .craft-nav-phone-mobile,
.dark body[data-nav-chrome="light"] .craft-header-bar .craft-btn,
.dark body[data-nav-chrome="light"] .craft-header-bar .craft-nav-phone,
.dark body[data-nav-chrome="light"] .craft-header-bar .craft-nav-phone-mobile {
  color: #fff !important;
}

/* Outline CTAs on light chrome: keep dark brand ink even if page is .dark.
   Do not match .craft-nav-link.craft-cta-radius — that wiped active pills. */
body[data-nav-chrome="light"][data-btn="outline"] .craft-header-bar .craft-btn,
body[data-nav-chrome="light"][data-btn="outline"] .craft-header-bar a.craft-btn,
body[data-nav-chrome="light"][data-btn="outline"] .craft-header-bar .craft-nav-phone,
.dark body[data-nav-chrome="light"][data-btn="outline"] .craft-header-bar .craft-btn,
.dark body[data-nav-chrome="light"][data-btn="outline"] .craft-header-bar a.craft-btn,
.dark body[data-nav-chrome="light"][data-btn="outline"] .craft-header-bar .craft-nav-phone {
  background: transparent !important;
  color: var(--brand-700, #c2410c) !important;
  border: 2px solid var(--brand-600, #ea580c) !important;
  box-shadow: none !important;
}
body[data-nav-chrome="light"][data-btn="outline"] .craft-header-bar .craft-btn:hover,
body[data-nav-chrome="light"][data-btn="outline"] .craft-header-bar a.craft-btn:hover,
body[data-nav-chrome="light"][data-btn="outline"] .craft-header-bar .craft-nav-phone:hover,
.dark body[data-nav-chrome="light"][data-btn="outline"] .craft-header-bar .craft-btn:hover,
.dark body[data-nav-chrome="light"][data-btn="outline"] .craft-header-bar a.craft-btn:hover,
.dark body[data-nav-chrome="light"][data-btn="outline"] .craft-header-bar .craft-nav-phone:hover {
  background: var(--brand-50, #fff7ed) !important;
  color: var(--brand-800, #9a3412) !important;
}

/*
 * Adaptive-nav chrome (floating_bar / underline_minimal)
 * -----------------------------------------------------
 * Header surface follows page theme (cream ↔ slate). Apply light lock in
 * light mode and dark lock in .dark mode.
 */
body[data-nav-chrome="adaptive"] .craft-site-header {
  --craft-nav-fg: rgb(51 65 85);
  --craft-nav-fg-muted: rgb(100 116 139);
  --craft-nav-fg-active: var(--brand-700, #c2410c);
  --craft-nav-hover-bg: var(--brand-50, #fff7ed);
  --craft-nav-active-bg: color-mix(in srgb, var(--brand-500, #f97316) 14%, #fff);
}
.dark body[data-nav-chrome="adaptive"] .craft-site-header {
  --craft-nav-fg: #f8fafc;
  --craft-nav-fg-muted: #94a3b8;
  --craft-nav-fg-active: var(--brand-300, #fdba74);
  --craft-nav-hover-bg: rgb(255 255 255 / 0.08);
  --craft-nav-active-bg: color-mix(in srgb, var(--brand-500, #f97316) 28%, rgb(15 23 42));
}

body[data-nav-chrome="adaptive"] .craft-header-bar .font-display {
  color: rgb(15 23 42) !important;
}
.dark body[data-nav-chrome="adaptive"] .craft-header-bar .font-display {
  color: #f8fafc !important;
}
body[data-nav-chrome="adaptive"] .craft-header-bar a.group:hover .font-display {
  color: var(--craft-nav-fg-active) !important;
}
body[data-nav-chrome="adaptive"] .craft-header-bar .craft-trust-inline {
  color: var(--craft-nav-fg-muted) !important;
}

body[data-nav-chrome="adaptive"] .craft-header-bar .craft-nav-link {
  color: var(--craft-nav-fg) !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none;
}
body[data-nav-chrome="adaptive"] .craft-header-bar .craft-nav-link:hover {
  background-color: var(--craft-nav-hover-bg) !important;
  color: var(--craft-nav-fg-active) !important;
}
body[data-nav-chrome="adaptive"] .craft-header-bar .craft-nav-link.is-active {
  background-image: none !important;
  background-color: var(--craft-nav-active-bg) !important;
  color: var(--craft-nav-fg-active) !important;
  box-shadow: inset 0 -2px 0 var(--brand-600, #ea580c);
}
.dark body[data-nav-chrome="adaptive"] .craft-header-bar .craft-nav-link.is-active {
  color: #fff !important;
  box-shadow: inset 0 -2px 0 var(--brand-400, #fb923c);
}
.dark body[data-nav-chrome="adaptive"] .craft-header-bar .craft-nav-link:hover {
  color: #fff !important;
}

body[data-nav-chrome="adaptive"] .craft-header-bar .craft-nav-icon-btn {
  color: var(--craft-nav-fg-muted) !important;
  background-color: transparent !important;
}
body[data-nav-chrome="adaptive"] .craft-header-bar .craft-nav-icon-btn:hover,
body[data-nav-chrome="adaptive"] .craft-header-bar .craft-nav-icon-btn:focus-visible {
  color: var(--craft-nav-fg-active) !important;
  background-color: var(--craft-nav-hover-bg) !important;
}

body[data-nav-chrome="adaptive"] .craft-header-bar .craft-btn,
body[data-nav-chrome="adaptive"] .craft-header-bar .craft-nav-phone,
body[data-nav-chrome="adaptive"] .craft-header-bar .craft-nav-phone-mobile {
  color: #fff !important;
}

/* Outline on adaptive: brand ink in light mode, brand-300 in dark mode.
   CTAs only — never .craft-nav-link.craft-cta-radius. */
body[data-nav-chrome="adaptive"][data-btn="outline"] .craft-header-bar .craft-btn,
body[data-nav-chrome="adaptive"][data-btn="outline"] .craft-header-bar a.craft-btn,
body[data-nav-chrome="adaptive"][data-btn="outline"] .craft-header-bar .craft-nav-phone {
  background: transparent !important;
  color: var(--brand-700, #c2410c) !important;
  border: 2px solid var(--brand-600, #ea580c) !important;
  box-shadow: none !important;
}
body[data-nav-chrome="adaptive"][data-btn="outline"] .craft-header-bar .craft-btn:hover,
body[data-nav-chrome="adaptive"][data-btn="outline"] .craft-header-bar a.craft-btn:hover,
body[data-nav-chrome="adaptive"][data-btn="outline"] .craft-header-bar .craft-nav-phone:hover {
  background: var(--brand-50, #fff7ed) !important;
  color: var(--brand-800, #9a3412) !important;
}
.dark body[data-nav-chrome="adaptive"][data-btn="outline"] .craft-header-bar .craft-btn,
.dark body[data-nav-chrome="adaptive"][data-btn="outline"] .craft-header-bar a.craft-btn,
.dark body[data-nav-chrome="adaptive"][data-btn="outline"] .craft-header-bar .craft-nav-phone {
  color: var(--brand-300, #fdba74) !important;
  border-color: var(--brand-400, #fb923c) !important;
}
.dark body[data-nav-chrome="adaptive"][data-btn="outline"] .craft-header-bar .craft-btn:hover,
.dark body[data-nav-chrome="adaptive"][data-btn="outline"] .craft-header-bar a.craft-btn:hover,
.dark body[data-nav-chrome="adaptive"][data-btn="outline"] .craft-header-bar .craft-nav-phone:hover {
  background: rgb(255 255 255 / 0.08) !important;
  color: #fff !important;
}

/* underline_minimal: active = underline only, no pill fill */
body[data-nav="underline_minimal"] .craft-header-bar .craft-nav-link.is-active {
  background-color: transparent !important;
  box-shadow: inset 0 -2px 0 var(--brand-600, #ea580c) !important;
}

/* Trust chrome */
body[data-trust="hidden"] .craft-trust-bar,
body[data-trust="hidden"] .craft-trust-pill-row,
body[data-trust="hidden"] .craft-trust-inline {
  display: none !important;
}
body[data-trust="slim_strip"] .craft-trust-bar {
  padding-block: 0.25rem;
  font-size: 0.65rem;
}
body[data-trust="slim_strip"] .craft-trust-bar ul {
  justify-content: center;
  gap: 1.25rem;
}
body[data-trust="slim_strip"] .craft-trust-bar li:last-child {
  display: none;
}
body[data-trust="slim_strip"] .craft-trust-pill-row,
body[data-trust="slim_strip"] .craft-trust-inline {
  display: none !important;
}
/* Default badge_bar: show top bar only */
body[data-trust="badge_bar"] .craft-trust-pill-row,
body[data-trust="badge_bar"] .craft-trust-inline {
  display: none !important;
}
/* Pill row: hide full top bar, show pills */
body[data-trust="pill_row"] .craft-trust-topbar,
body[data-trust="pill_row"] .craft-trust-inline {
  display: none !important;
}
body[data-trust="pill_row"] .craft-trust-pill-row {
  display: block !important;
}
/* Inline under logo: hide bars, show logo line */
body[data-trust="inline_logo"] .craft-trust-topbar,
body[data-trust="inline_logo"] .craft-trust-pill-row {
  display: none !important;
}
body[data-trust="inline_logo"] .craft-trust-inline {
  display: flex !important;
}
body:not([data-trust="inline_logo"]) .craft-trust-inline {
  display: none !important;
}
body:not([data-trust="pill_row"]) .craft-trust-pill-row {
  display: none !important;
}

/* Section surfaces */
body[data-surface="banded"] main > section:nth-of-type(even),
body[data-surface="banded"] [data-qa-section]:nth-of-type(even) {
  background-color: color-mix(in srgb, var(--craft-page-bg, #f4f3f1) 88%, #fff);
}
.dark body[data-surface="banded"] main > section:nth-of-type(even),
.dark body[data-surface="banded"] [data-qa-section]:nth-of-type(even) {
  background-color: rgb(15 23 42 / 0.45);
}
body[data-surface="ruled"] [data-qa-section] {
  border-bottom: 1px solid rgb(226 232 240 / 0.95);
}
.dark body[data-surface="ruled"] [data-qa-section] {
  border-bottom-color: rgb(51 65 85);
}
body[data-surface="flush"] [data-qa-section] {
  border-color: transparent;
}

/* Type scale helpers (vars from dna.css) */
body[data-type="editorial"] .font-display {
  text-transform: none !important;
}
body[data-type="compact_ui"] .font-display {
  letter-spacing: 0 !important;
}

/* Button tones */
body[data-btn="outline"] .craft-btn,
body[data-btn="outline"] a.craft-cta-radius.bg-brand-600 {
  background: transparent !important;
  color: var(--brand-700, #c2410c) !important;
  border: 2px solid var(--brand-600, #ea580c);
  box-shadow: none !important;
}
body[data-btn="outline"] .craft-btn:hover,
body[data-btn="outline"] a.craft-cta-radius.bg-brand-600:hover {
  background: var(--brand-50, #fff7ed) !important;
}
.dark body[data-btn="outline"] .craft-btn,
.dark body[data-btn="outline"] a.craft-cta-radius.bg-brand-600 {
  color: var(--brand-300, #fdba74) !important;
  border-color: var(--brand-400, #fb923c);
}
body[data-btn="brand_shadow"] .craft-btn,
body[data-btn="brand_shadow"] a.craft-cta-radius.bg-brand-600 {
  box-shadow: 0 10px 28px -8px color-mix(in srgb, var(--brand-600, #ea580c) 65%, transparent);
}

/* Footer styles */
body[data-footer="cta_band"] .craft-footer {
  border-top-width: 0;
}
body[data-footer="cta_band"] .craft-footer::before {
  content: "";
  display: block;
  height: 0.35rem;
  background: linear-gradient(90deg, var(--brand-700), var(--brand-400), var(--brand-700));
}

/* Motion intensity */
body[data-motion="subtle"] [data-animate] {
  transition-duration: 450ms;
  transform: translateY(10px);
}
body[data-motion="standard"] [data-animate] {
  transition-duration: 700ms;
  transform: translateY(18px);
}
body[data-motion="subtle"] [data-animate].in-view,
body[data-motion="standard"] [data-animate].in-view {
  transform: none;
}

/* Home composition layouts (services / reviews / gallery / cta)
   Dual-run: home services_layout, reviews_layout, and gallery_layout are now
   Jinja-dispatched; keep these CSS rules as no-op/fallback until QA retires
   them. CTA stays CSS. */
body[data-services="grid_3"] [data-qa-section="services"] .craft-services-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.25rem;
}
@media (min-width: 768px) {
  body[data-services="grid_3"] [data-qa-section="services"] .craft-services-grid {
    grid-template-columns: repeat(3, 1fr);
  }
  body[data-services="grid_3"] [data-qa-section="services"] .craft-services-grid > * {
    grid-column: span 1 !important;
  }
}
body[data-services="stacked_list"] [data-qa-section="services"] .craft-services-grid {
  display: flex;
  flex-direction: column;
  gap: 0.85rem;
}
body[data-services="stacked_list"] [data-qa-section="services"] .craft-services-grid > * {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: start;
  gap: 1rem;
}

/* Gallery/reviews dual-run CSS retired (R6) — Jinja partials own structure. */

body[data-cta="full_band"] [data-qa-section="cta"] > div {
  max-width: none !important;
  padding-inline: 0 !important;
}
body[data-cta="full_band"] [data-qa-section="cta"] .craft-cta-panel {
  border-radius: 0 !important;
  border-left: none !important;
  border-right: none !important;
}
body[data-cta="split_photo"] [data-qa-section="cta"] .craft-cta-panel {
  text-align: left !important;
}
@media (min-width: 768px) {
  body[data-cta="split_photo"] [data-qa-section="cta"] .craft-cta-panel {
    display: grid;
    grid-template-columns: 1.2fr 0.8fr;
    align-items: center;
    gap: 2rem;
    text-align: left;
  }
  body[data-cta="split_photo"] [data-qa-section="cta"] .craft-cta-media {
    margin-top: 0 !important;
    height: 100%;
  }
  body[data-cta="split_photo"] [data-qa-section="cta"] .craft-cta-media img {
    height: 100%;
    min-height: 14rem;
  }
}

/* Footer: tighten CTA→footer air; brand-forward stacked_brand (not skinny center stack) */
.craft-footer {
  margin-top: 0 !important;
}
body[data-footer="stacked_brand"] .craft-footer .craft-footer-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.75rem;
  text-align: left;
  align-items: start;
}
body[data-footer="stacked_brand"] .craft-footer .craft-footer-grid > div {
  max-width: none;
  width: 100%;
}
@media (min-width: 768px) {
  /* Brand full-width band, then links | contact — distinct from plain columns */
  body[data-footer="stacked_brand"] .craft-footer .craft-footer-grid {
    grid-template-columns: 1fr 1fr;
    grid-template-areas:
      "brand brand"
      "links contact";
    column-gap: 2.5rem;
    row-gap: 1.5rem;
  }
  body[data-footer="stacked_brand"] .craft-footer .craft-footer-grid > div:nth-child(1) {
    grid-area: brand;
    padding-bottom: 1.25rem;
    border-bottom: 1px solid rgb(255 255 255 / 0.1);
  }
  body[data-footer="stacked_brand"] .craft-footer .craft-footer-grid > div:nth-child(2) {
    grid-area: links;
  }
  body[data-footer="stacked_brand"] .craft-footer .craft-footer-grid > div:nth-child(3) {
    grid-area: contact;
  }
}
body[data-footer="stacked_brand"] .craft-footer .craft-footer-grid > div:first-child .flex.flex-wrap {
  justify-content: flex-start;
  gap: 0.4rem;
}
body[data-footer="stacked_brand"] .craft-footer .craft-footer-legal-address {
  display: none;
}
body[data-density="compact"] .craft-section-pad {
  padding-block: 2.5rem !important;
}
body[data-density="roomy"] .craft-section-pad {
  padding-block: 5rem !important;
}

/* R2 craft: dark-mode soft/cream hero contrast */
.dark [data-qa-section="hero"] .bg-cream,
.dark [data-qa-section="hero"].bg-cream {
  background-color: rgb(2 6 23) !important;
}
.dark [data-qa-section="hero"] h1 {
  color: #f8fafc;
}
.dark [data-qa-section="hero"] p {
  color: rgb(203 213 225);
}

/* Inner page polish: content-sized panels, density-aware pads */
.craft-page-panel {
  padding: 1.25rem 1.5rem;
}
body[data-density="compact"] .craft-page-panel {
  padding: 0.85rem 1.1rem;
}
body[data-density="roomy"] .craft-page-panel {
  padding: 1.75rem 2rem;
}
main#main-content > section.craft-section-pad,
main#main-content [data-qa-section].craft-section-pad {
  /* density hooks already on .craft-section-pad */
}
/* Avoid hollow empty states */
.craft-empty-note {
  font-size: 0.875rem;
  color: rgb(100 116 139);
  padding: 1rem 0;
}
.dark .craft-empty-note {
  color: rgb(148 163 184);
}

/* Phone-forward mobile: keep tel visible in header utilities */
body[data-nav="phone_forward"] .craft-nav-phone-mobile {
  display: inline-flex !important;
}
@media (max-width: 767px) {
  body[data-nav="phone_forward"] .craft-nav-phone-mobile {
    display: inline-flex !important;
  }
}
body[data-about-hero="compact"] .craft-page-hero,
body[data-services-page-hero="compact"] .craft-page-hero,
body[data-reviews-page-hero="compact"] .craft-page-hero,
body[data-contact-page-hero="compact"] .craft-page-hero,
body[data-page-hero="compact"] .craft-page-hero {
  padding-block: 2rem !important;
}
body[data-about-hero="compact"] .craft-page-hero h1,
body[data-services-page-hero="compact"] .craft-page-hero h1,
body[data-reviews-page-hero="compact"] .craft-page-hero h1,
body[data-contact-page-hero="compact"] .craft-page-hero h1,
body[data-page-hero="compact"] .craft-page-hero h1 {
  font-size: clamp(1.75rem, 3vw, 2.25rem) !important;
}

/* Hide broken gallery tiles (no empty grey cells) */
.craft-gallery-tile.is-broken {
  display: none !important;
}

/* Pack mosaic/bento tiles into holes left by uneven spans */
.craft-gallery-grid {
  grid-auto-flow: dense;
}

/* Accordion panels fill content bounds */
.craft-accordion > div {
  width: 100%;
}

/* Contact: avoid oversized empty map wells + column stretch voids */
.craft-contact-aside .craft-map-embed--compact {
  min-height: 220px;
}
.craft-contact-grid {
  align-items: start;
}
.craft-contact-grid .craft-inner-aside,
.craft-contact-grid .craft-inner-main {
  align-self: start;
  width: 100%;
}
.craft-map-embed iframe {
  background: transparent;
}
a.bg-brand-600,
button.bg-brand-600,
.craft-cta-radius.bg-brand-600,
.craft-btn.bg-brand-600,
.craft-nav-phone,
.craft-nav-phone-mobile {
  background-color: color-mix(in srgb, var(--brand-600, #ea580c) 72%, #000) !important;
  color: #fff !important;
}
a.bg-brand-600:hover,
button.bg-brand-600:hover,
.craft-cta-radius.bg-brand-600:hover,
.craft-btn.bg-brand-600:hover {
  background-color: color-mix(in srgb, var(--brand-600, #ea580c) 58%, #000) !important;
}

/* Reviews meta density */
body[data-reviews-meta="minimal"] .craft-review-meta-extra {
  display: none !important;
}
body[data-reviews-meta="source_only"] .craft-review-avatar,
body[data-reviews-meta="source_only"] .craft-review-project {
  display: none !important;
}

/* Contact form-only: widen main when Jinja used form_only (legacy aid) */
body[data-contact-layout="form_only"] .craft-inner-main {
  max-width: 42rem;
  margin-inline: auto;
}