/* White, orange, grey and green sampled from the supplied HourNerd logo.
   Loaded after the existing styles so page layouts and interactions are preserved. */
:root {
  color-scheme: light;
  --orange: #f4901c;
  --orange-ink: #a34a00;
  --orange-soft: #fff3e5;
  --green: #c0d72d;
  --green-ink: #52610a;
  --green-soft: #f5f8e3;
  --ink: #303842;
  --muted: #5e646b;
  --paper: #ffffff;
  --off: #f5f5f3;
  --line: #d0d4d8;
  --shadow: 0 18px 45px rgba(48, 56, 66, .08);
  /* Existing component variables now resolve to the restored palette. */
  --navy: var(--off);
  --navy2: #eeeeeb;
  --navy3: #e5e7e3;
  --mint: var(--green-ink);
  --teal: var(--green-ink);
}

body { color: var(--ink); background: var(--paper); }
::selection { background: #e5ed9c; color: var(--ink); }
:focus-visible { outline: 3px solid var(--orange-ink); outline-offset: 4px; }
.muted { color: var(--muted); }
.eyebrow, .kicker, .detail-eyebrow { color: var(--green-ink); }

/* Preserve the supplied logo, including its original white background. */
.brand-logo { width: 160px; height: auto; max-height: none; object-fit: contain; }
.footer .brand, .home-footer .brand { background: #ffffff; border-radius: 12px; overflow: hidden; }
.footer .brand-logo, .legal-page .brand-logo { width: 218px; height: auto; max-height: none; }
@media (max-width: 900px) {
  .brand-logo { width: 140px; }
}
@media (max-width: 560px) {
  .brand-logo { width: 120px; }
  .footer .brand-logo, .legal-page .brand-logo { width: 196px; }
}

/* Header and navigation */
.site-header {
  background: #ffffff;
  border-bottom: 1px solid var(--line);
}
.site-header.scrolled { box-shadow: 0 8px 28px rgba(48, 56, 66, .09); }
.brand, .nav, .nav-toggle { color: var(--ink); }
.brand-mark { background: var(--orange); color: var(--ink); }
.brand-dot { color: var(--green-ink); }
.nav > a:not(.nav-cta):hover,
.nav-disclosure summary:hover,
.nav a[aria-current="page"] { color: var(--orange-ink); }
.nav-cta {
  color: var(--ink);
  background: var(--orange);
  border-color: var(--orange);
}
.nav-cta:hover, .nav-cta[aria-current="page"] {
  background: #ffa12f;
  color: var(--ink);
  border-color: #ffa12f;
}
.nav-menu {
  background: var(--paper);
  border-color: var(--line);
  box-shadow: var(--shadow);
}
.nav-menu a:hover, .nav-menu a:focus-visible {
  background: var(--orange-soft);
  color: var(--orange-ink);
}
.nav-menu .nav-all { color: var(--green-ink); border-top-color: var(--line); }
.nav-disclosure summary:focus-visible { outline-color: var(--orange-ink); }

/* The contact strip stays light, with a clear call/text treatment. */
.phone-bar { background: var(--off); color: var(--ink); border-bottom-color: var(--line); }
.phone-bar-caption { color: var(--muted); }
.phone-bar-call, .phone-bar-call strong { color: var(--ink); }
.phone-bar-call svg { color: var(--orange-ink); }
.phone-bar-call strong { color: var(--green-ink); }
.phone-bar-text { background: var(--paper); border-color: #bfc4c8; color: var(--ink); }
.phone-bar a:hover, .phone-bar-call:hover strong { color: var(--orange-ink); }
.phone-bar-text:hover { background: var(--orange-soft); }
.phone-bar a:focus-visible { outline-color: var(--orange-ink); }

/* Homepage hero */
.hero {
  background: radial-gradient(ellipse at 84% 24%, #f4f7e5 0, transparent 48%),
              linear-gradient(120deg, #ffffff 38%, #f7f7f4);
  color: var(--ink);
  border-bottom: 1px solid var(--line);
}
.hero-aura-one { background: rgba(192, 215, 45, .12); }
.hero-aura-two { background: rgba(244, 144, 28, .08); }
.pulse { background: var(--green); box-shadow: 0 0 0 5px rgba(192, 215, 45, .18); }
.hero em { color: var(--orange-ink); }
.hero-lead, .hero-proof, .hero-footer { color: var(--muted); }
.hero-proof svg { color: var(--green-ink); }
.btn-primary, .btn-dark {
  background: var(--orange);
  border-color: var(--orange);
  color: var(--ink);
}
.btn-primary:hover, .btn-dark:hover { background: #ffa12f; border-color: #ffa12f; color: var(--ink); }
.btn-outline { background: var(--paper); color: var(--ink); border-color: #aeb3b6; }
.btn-outline:hover { background: var(--green-soft); border-color: #829231; color: var(--ink); }
.orbit { border-color: rgba(117, 133, 32, .18); }
.visual-panel {
  background: var(--paper);
  border-color: #cbd0c7;
  box-shadow: 0 28px 65px rgba(48, 56, 66, .13);
}
.panel-top { background: var(--off); border-bottom-color: var(--line); color: var(--muted); }
.panel-lights i { background: #aeb3b6; }
.panel-lights i:first-child { background: var(--orange); }
.panel-lights i:nth-child(2) { background: #c6c8cc; }
.panel-lights i:nth-child(3) { background: var(--green); }
.status { color: var(--green-ink); }
.status span { background: #7c8c0d; }
.grid-art {
  background-color: #fdfefb;
  background-image: linear-gradient(rgba(48, 56, 66, .05) 1px, transparent 1px),
                    linear-gradient(90deg, rgba(48, 56, 66, .05) 1px, transparent 1px);
}
.connections { stroke: #91a235; }
.grid-node { color: var(--green-ink); background: var(--green-soft); border-color: #adba6c; }
.node-primary {
  color: var(--ink);
  background: var(--orange);
  border-color: #d97608;
  box-shadow: 0 0 45px rgba(244, 144, 28, .19);
}
.panel-bottom { border-top-color: var(--line); color: var(--muted); }
.panel-bottom strong { color: var(--green-ink); }
.floating-tag {
  background: var(--paper);
  color: var(--ink);
  border: 1px solid var(--line);
  box-shadow: 0 10px 28px rgba(48, 56, 66, .1);
}
.floating-tag span { color: var(--orange-ink); }
.floating-tag-one { border-left: 3px solid var(--green); }
.floating-tag-two { border-left: 3px solid var(--orange); }

/* Service cards and content sections */
.services, .approach-section { background: var(--off); }
.service-card { border-color: var(--line); }
.service-card:hover { box-shadow: var(--shadow); }
.service-card.featured { background: var(--orange-soft); color: var(--ink); border-color: #eac59a; }
.service-icon, .cap-icon { background: var(--green-soft); color: var(--green-ink); }
.service-card.featured .service-icon { background: #ffe4c0; color: var(--orange-ink); }
.service-card .card-label, .creative-service .card-label { color: var(--muted); }
.service-card p, .service-card.featured p { color: var(--muted); }
.card-link, .text-link { color: var(--green-ink); }
.service-card.featured .card-link { color: var(--orange-ink); }
.card-decoration { color: rgba(163, 74, 0, .045); }
.creative-service { border-top-color: var(--green); }
.creative-service .service-icon { background: var(--green-soft); }
.creative-bridge { background: var(--green-soft); }
.creative-intro { color: var(--muted); }
.association-intro h2 em { color: var(--orange-ink); }
.independent-note { color: var(--muted); }
.capability { border-bottom-color: var(--line); }
.capability > span { color: #737b65; }
.value-band { color: var(--ink); background: var(--off); border-block: 1px solid var(--line); }
.value-band .kicker { color: var(--green-ink); }
.statement span { color: var(--orange-ink); }
.value-points { border-top-color: #cbd0c1; }
.value-points p { color: var(--muted); }
.check-panel { background: var(--off); border-color: var(--line); }
.check-panel li { border-bottom-color: var(--line); }
.check-panel svg { color: var(--green-ink); }
.personal-section { background: var(--green-soft); color: var(--ink); }
.personal-section .kicker { color: var(--green-ink); }
.personal-section em { color: var(--orange-ink); }
.personal-section p { color: var(--muted); }
.personal-chips span { border-color: #c3cba5; color: var(--ink); background: rgba(255, 255, 255, .6); }
.personal-graphic { background: radial-gradient(circle, #e9edca 10%, transparent 64%); }
.friendly-icon { border-color: #94a229; color: var(--green-ink); box-shadow: 0 0 70px rgba(192, 215, 45, .12); }
.friendly-icon span { background: var(--orange); color: var(--ink); }
.friendly-type { color: var(--green-ink); }
.step-number { color: var(--orange-ink); }
.step-line { background: var(--line); }
.step-line:before { background: var(--green); }

/* Forms */
.contact-section { background: var(--off); }
.contact-intro h2 em { color: var(--orange-ink); }
.contact-intro > p, .contact-method small { color: var(--muted); }
.contact-method-icon { color: var(--green-ink); background: #e9edcf; }
.contact-method a:hover { color: var(--orange-ink); }
.contact-card { border: 1px solid var(--line); box-shadow: var(--shadow); }
.contact-card label { color: var(--ink); }
.contact-card label span { color: #a33d25; }
.contact-card label .optional { color: var(--muted); }
.contact-card input, .contact-card select, .contact-card textarea {
  background: #fbfbfa;
  border-color: #bfc4c8;
  color: var(--ink);
  accent-color: var(--green-ink);
}
.contact-card input:focus, .contact-card select:focus, .contact-card textarea:focus { outline-color: var(--orange-ink); }
.form-disclaimer { color: var(--muted); }
.form-alert.success { background: var(--green-soft); color: var(--green-ink); }

/* Interior service pages */
.detail-hero {
  background: radial-gradient(ellipse at 88% 16%, #f1f5dd 0, transparent 52%),
              linear-gradient(120deg, #ffffff 25%, #f8f8f5);
  color: var(--ink);
  border-bottom: 1px solid var(--line);
}
.detail-hero p, .detail-section p, .detail-card p { color: var(--muted); }
.detail-alt { background: var(--off); }
.detail-list, .detail-card { border-color: var(--line); }
.detail-list { box-shadow: var(--shadow); }
.detail-list li { border-bottom-color: var(--line); }
.detail-list li span:first-child, .detail-arrow { color: var(--green-ink); }
.detail-related { background: var(--off); }
.detail-cta { background: var(--green-soft); color: var(--ink); border-block: 1px solid #dce1c3; }
.detail-cta p { color: var(--muted); }
.detail-cta .kicker { color: var(--green-ink); }
.service-scope-note { border-left-color: var(--green); background: var(--green-soft); color: var(--ink); }

/* Footer and legal pages */
.footer { background: #f0f1ee; color: var(--muted); border-top: 1px solid var(--line); }
.footer-main h4 { color: var(--ink); }
.footer-main a:hover { color: var(--orange-ink); }
.footer-bottom { border-top-color: #cdd1ce; color: var(--muted); }
.legal-page { background: var(--off); color: var(--ink); }
.legal-page article { border: 1px solid var(--line); }
.legal-page article p { color: var(--muted); }
.legal-page article a:not(.btn) { color: var(--green-ink); }

/* Keep the existing compact navigation at every responsive breakpoint. */
@media (max-width: 1080px) {
  .nav { background: var(--paper); border-bottom-color: var(--line); }
  .nav-menu { background: var(--off); }
}