:root {
      --color-ink: #111111;
      --color-mid: #686868;
      --color-line: #d9d9d4;
      --color-soft: #f2f2ed;
      --color-paper: #fcfcf8;
      --color-accent: #d9ff36;
      --font-display: "Manrope", Arial, sans-serif;
      --font-body: "DM Mono", monospace;
      --text-xs: 0.75rem;
      --text-sm: 0.875rem;
      --text-base: 1rem;
      --text-lg: 1.125rem;
      --text-xl: 1.25rem;
      --text-2xl: 1.5rem;
      --text-3xl: 2rem;
      --text-4xl: 2.75rem;
      --text-5xl: 4.5rem;
      --text-6xl: 6.25rem;
      --space-1: 0.25rem;
      --space-2: 0.5rem;
      --space-3: 0.75rem;
      --space-4: 1rem;
      --space-5: 1.25rem;
      --space-6: 1.5rem;
      --space-8: 2rem;
      --space-10: 2.5rem;
      --space-12: 3rem;
      --space-16: 4rem;
      --space-20: 5rem;
      --space-24: 6rem;
      --space-32: 8rem;
      --radius-sm: 0.375rem;
      --radius-md: 0.75rem;
      --radius-lg: 1.25rem;
      --radius-pill: 999rem;
      --line-thin: 1px;
      --header-height: 5rem;
      --content-width: 90rem;
      --panel-width: 31rem;
      --image-ratio: 4 / 3;
      --transition-fast: 180ms;
      --transition-base: 450ms;
      --shadow-card: 0 1rem 2.5rem rgba(17, 17, 17, 0.10);
      --shadow-panel: -1rem 0 3rem rgba(17, 17, 17, 0.18);
      }
      * { box-sizing: border-box; }
      html {
      scroll-behavior: smooth;
      background: var(--color-paper);
      }
      body {
      margin: 0;
      color: var(--color-ink);
      background: var(--color-paper);
      font-family: var(--font-body);
      font-size: var(--text-sm);
      line-height: 1.5;
      }
      button, input, textarea { font: inherit; }
      button { cursor: pointer; }
      a { color: inherit; text-decoration: none; }
      .shell {
      width: min(calc(100% - var(--space-12)), var(--content-width));
      margin-inline: auto;
      }
      .eyebrow {
      display: flex;
      align-items: center;
      gap: var(--space-2);
      margin: 0 0 var(--space-5);
      color: var(--color-mid);
      font-size: var(--text-xs);
      letter-spacing: 0.08em;
      text-transform: uppercase;
      }
      .eyebrow::before {
      width: var(--space-2);
      height: var(--space-2);
      content: "";
      background: var(--color-accent);
      border-radius: var(--radius-pill);
      }
      h1, h2, h3, p { margin-top: 0; }
      h1, h2, h3 {
      font-family: var(--font-display);
      font-weight: 600;
      letter-spacing: -0.055em;
      line-height: 0.98;
      }
      h1 {
      max-width: 11ch;
      margin-bottom: var(--space-6);
      font-size: clamp(var(--text-4xl), 7vw, var(--text-6xl));
      }
      h2 {
      max-width: 14ch;
      margin-bottom: var(--space-6);
      font-size: clamp(var(--text-3xl), 4vw, var(--text-5xl));
      }
      h3 {
      margin-bottom: var(--space-3);
      font-size: var(--text-xl);
      }
      .section-head {
      display: flex;
      align-items: end;
      justify-content: space-between;
      gap: var(--space-8);
      margin-bottom: var(--space-10);
      }
      .section-head p {
      max-width: 42ch;
      margin: 0;
      color: var(--color-mid);
      font-size: var(--text-sm);
      }
      .button {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: var(--space-2);
      min-height: var(--space-12);
      padding: var(--space-3) var(--space-5);
      border: var(--line-thin) solid var(--color-ink);
      border-radius: var(--radius-pill);
      background: var(--color-ink);
      color: var(--color-paper);
      font-family: var(--font-display);
      font-size: var(--text-sm);
      font-weight: 600;
      letter-spacing: -0.02em;
      transition: transform var(--transition-fast), background var(--transition-fast), color var(--transition-fast);
      }
      .button:hover { transform: translateY(calc(var(--space-1) * -1)); }
      .button-accent {
      background: var(--color-accent);
      color: var(--color-ink);
      }
      .button-quiet {
      background: transparent;
      color: var(--color-ink);
      }
      iconify-icon {
      font-size: var(--text-lg);
      stroke-width: 1.5;
      }
      .site-header {
      position: sticky;
      z-index: 20;
      top: 0;
      border-bottom: var(--line-thin) solid var(--color-line);
      background: rgba(252, 252, 248, 0.93);
      backdrop-filter: blur(var(--space-3));
      }
      .header-inner {
      display: grid;
      grid-template-columns: auto 1fr auto auto;
      align-items: center;
      min-height: var(--header-height);
      gap: var(--space-6);
      }
      .wordmark {
      font-family: var(--font-display);
      font-size: var(--text-lg);
      font-weight: 600;
      letter-spacing: -0.07em;
      white-space: nowrap;
      }
      .wordmark span { color: var(--color-mid); }
      .primary-nav {
      display: flex;
      justify-content: center;
      gap: var(--space-5);
      color: var(--color-mid);
      font-size: var(--text-xs);
      }
      .primary-nav a:hover { color: var(--color-ink); }
      .header-phone {
      font-family: var(--font-display);
      font-size: var(--text-sm);
      font-weight: 600;
      white-space: nowrap;
      }
      .menu-button { display: none; }
      .hero {
      padding: var(--space-20) 0 var(--space-16);
      }
      .hero-grid {
      display: grid;
      grid-template-columns: repeat(12, 1fr);
      align-items: center;
      gap: var(--space-6);
      }
      .hero-copy { grid-column: span 6; }
      .hero-copy > p {
      max-width: 48ch;
      margin-bottom: var(--space-8);
      color: var(--color-mid);
      font-size: var(--text-lg);
      line-height: 1.55;
      }
      .button-row {
      display: flex;
      flex-wrap: wrap;
      gap: var(--space-3);
      }
      .hero-visual {
      position: relative;
      grid-column: span 6;
      padding-left: var(--space-4);
      }
      .image-block {
      position: relative;
      display: flex;
      align-items: center;
      justify-content: center;
      width: 100%;
      overflow: hidden;
      border: var(--line-thin) solid var(--color-line);
      border-radius: var(--radius-lg);
      background:
      linear-gradient(135deg, transparent 49%, var(--color-line) 50%, transparent 51%),
      linear-gradient(45deg, transparent 49%, var(--color-line) 50%, transparent 51%),
      var(--color-soft);
      aspect-ratio: var(--image-ratio);
      color: var(--color-mid);
      font-size: var(--text-xs);
      letter-spacing: 0.06em;
      text-align: center;
      text-transform: uppercase;
      }
      .hero-image {
      aspect-ratio: 5 / 4;
      background-color: var(--color-soft);
      }
      .job-card {
      position: absolute;
      right: calc(var(--space-4) * -1);
      bottom: var(--space-6);
      width: min(72%, 19rem);
      padding: var(--space-5);
      border: var(--line-thin) solid var(--color-ink);
      border-radius: var(--radius-md);
      background: var(--color-paper);
      box-shadow: var(--shadow-card);
      }
      .job-card-top {
      display: flex;
      justify-content: space-between;
      gap: var(--space-3);
      margin-bottom: var(--space-5);
      color: var(--color-mid);
      font-size: var(--text-xs);
      }
      .status {
      display: inline-flex;
      align-items: center;
      gap: var(--space-1);
      padding: var(--space-1) var(--space-2);
      border-radius: var(--radius-pill);
      background: var(--color-accent);
      color: var(--color-ink);
      font-size: var(--text-xs);
      white-space: nowrap;
      }
      .job-card strong {
      display: block;
      margin-bottom: var(--space-1);
      font-family: var(--font-display);
      font-size: var(--text-base);
      letter-spacing: -0.03em;
      }
      .job-card p {
      margin: 0;
      color: var(--color-mid);
      font-size: var(--text-xs);
      }
      .marquee-wrap {
      overflow: hidden;
      border-top: var(--line-thin) solid var(--color-line);
      border-bottom: var(--line-thin) solid var(--color-line);
      background: var(--color-ink);
      color: var(--color-paper);
      }
      .marquee-track {
      display: flex;
      width: max-content;
      animation: move-left 28s linear infinite;
      }
      .marquee-group {
      display: flex;
      flex-shrink: 0;
      }
      .badge {
      display: flex;
      align-items: center;
      gap: var(--space-3);
      min-width: 14rem;
      padding: var(--space-5) var(--space-8);
      border-right: var(--line-thin) solid var(--color-mid);
      font-family: var(--font-display);
      font-size: var(--text-sm);
      font-weight: 500;
      letter-spacing: -0.03em;
      }
      .badge iconify-icon { color: var(--color-accent); }
      section { padding: var(--space-24) 0; }
      .why-grid {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      grid-template-rows: repeat(2, minmax(12rem, auto));
      gap: var(--space-4);
      }
      .why-card {
      display: flex;
      flex-direction: column;
      justify-content: space-between;
      padding: var(--space-6);
      border: var(--line-thin) solid var(--color-line);
      border-radius: var(--radius-lg);
      background: var(--color-soft);
      transition: transform var(--transition-fast), border-color var(--transition-fast);
      }
      .why-card:hover {
      border-color: var(--color-ink);
      transform: translateY(calc(var(--space-1) * -1));
      }
      .why-card.featured {
      grid-row: span 2;
      grid-column: span 2;
      background: var(--color-ink);
      color: var(--color-paper);
      }
      .why-card.featured p { color: var(--color-line); }
      .why-card p { margin: 0; color: var(--color-mid); font-size: var(--text-sm); }
      .icon-box {
      display: grid;
      width: var(--space-10);
      height: var(--space-10);
      margin-bottom: var(--space-10);
      place-items: center;
      border: var(--line-thin) solid currentColor;
      border-radius: var(--radius-sm);
      }
      .featured .icon-box {
      border-color: var(--color-accent);
      color: var(--color-accent);
      }
      .services-layout {
      display: grid;
      grid-template-columns: repeat(12, 1fr);
      gap: var(--space-8);
      }
      .service-list { grid-column: span 5; }
      .service-item {
      display: flex;
      align-items: center;
      justify-content: space-between;
      width: 100%;
      padding: var(--space-5) 0;
      border: 0;
      border-bottom: var(--line-thin) solid var(--color-line);
      background: transparent;
      color: var(--color-mid);
      text-align: left;
      transition: color var(--transition-fast), padding var(--transition-fast);
      }
      .service-item span {
      font-family: var(--font-display);
      font-size: var(--text-xl);
      font-weight: 500;
      letter-spacing: -0.05em;
      }
      .service-item:hover,
      .service-item.active {
      padding-left: var(--space-4);
      color: var(--color-ink);
      }
      .service-item.active {
      border-bottom-color: var(--color-ink);
      }
      .service-preview {
      grid-column: span 7;
      min-height: 100%;
      }
      .service-preview .image-block {
      height: 100%;
      min-height: 28rem;
      background-color: var(--color-soft);
      }
      .preview-caption {
      display: flex;
      justify-content: space-between;
      padding-top: var(--space-4);
      color: var(--color-mid);
      font-size: var(--text-xs);
      }
      .stats {
      padding: var(--space-16) 0;
      background: var(--color-accent);
      }
      .stats-grid {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: var(--space-6);
      }
      .stat {
      padding-right: var(--space-4);
      border-right: var(--line-thin) solid var(--color-ink);
      }
      .stat:last-child { border-right: 0; }
      .stat-number {
      display: block;
      margin-bottom: var(--space-2);
      font-family: var(--font-display);
      font-size: clamp(var(--text-3xl), 5vw, var(--text-5xl));
      font-weight: 600;
      letter-spacing: -0.075em;
      line-height: 1;
      }
      .stat-label {
      color: var(--color-ink);
      font-size: var(--text-xs);
      text-transform: uppercase;
      }
      .filter-row {
      display: flex;
      flex-wrap: wrap;
      gap: var(--space-2);
      }
      .filter-button {
      padding: var(--space-2) var(--space-4);
      border: var(--line-thin) solid var(--color-line);
      border-radius: var(--radius-pill);
      background: transparent;
      color: var(--color-mid);
      font-size: var(--text-xs);
      }
      .filter-button.active {
      border-color: var(--color-ink);
      background: var(--color-ink);
      color: var(--color-paper);
      }
      .jobs-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: var(--space-5);
      }
      .job-item {
      overflow: hidden;
      border: var(--line-thin) solid var(--color-line);
      border-radius: var(--radius-lg);
      background: var(--color-paper);
      transition: transform var(--transition-fast);
      }
      .job-item:hover { transform: translateY(calc(var(--space-1) * -1)); }
      .job-item[hidden] { display: none; }
      .job-item .image-block {
      border: 0;
      border-radius: 0;
      aspect-ratio: 16 / 10;
      }
      .job-content { padding: var(--space-5); }
      .job-meta {
      display: flex;
      justify-content: space-between;
      gap: var(--space-3);
      margin-bottom: var(--space-3);
      color: var(--color-mid);
      font-size: var(--text-xs);
      }
      .job-content h3 { font-size: var(--text-lg); }
      .job-content p { margin: 0; color: var(--color-mid); font-size: var(--text-xs); }
      .cta-band {
      background: var(--color-ink);
      color: var(--color-paper);
      }
      .cta-inner {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: var(--space-10);
      }
      .cta-inner h2 { margin-bottom: var(--space-4); }
      .cta-inner p { max-width: 54ch; margin: 0; color: var(--color-line); }
      .testimonials {
      overflow: hidden;
      padding-bottom: var(--space-20);
      }
      .testimonial-track {
      display: flex;
      width: max-content;
      margin-bottom: var(--space-4);
      animation: move-left 38s linear infinite;
      }
      .testimonial-track.reverse { animation-name: move-right; }
      .testimonial-track:hover { animation-play-state: paused; }
      .testimonial-card {
      width: 21rem;
      min-height: 12rem;
      margin-right: var(--space-4);
      padding: var(--space-6);
      border: var(--line-thin) solid var(--color-line);
      border-radius: var(--radius-lg);
      background: var(--color-soft);
      }
      .testimonial-card blockquote {
      margin: 0 0 var(--space-6);
      font-family: var(--font-display);
      font-size: var(--text-base);
      font-weight: 500;
      letter-spacing: -0.03em;
      line-height: 1.35;
      }
      .testimonial-card cite {
      color: var(--color-mid);
      font-size: var(--text-xs);
      font-style: normal;
      }
      .faq-layout {
      display: grid;
      grid-template-columns: repeat(12, 1fr);
      gap: var(--space-8);
      }
      .faq-list { grid-column: span 8; }
      .faq-item {
      border-top: var(--line-thin) solid var(--color-line);
      }
      .faq-item:last-child { border-bottom: var(--line-thin) solid var(--color-line); }
      .faq-question {
      display: flex;
      align-items: center;
      justify-content: space-between;
      width: 100%;
      padding: var(--space-5) 0;
      border: 0;
      background: transparent;
      color: var(--color-ink);
      font-family: var(--font-display);
      font-size: var(--text-lg);
      font-weight: 500;
      letter-spacing: -0.04em;
      text-align: left;
      }
      .faq-question iconify-icon { transition: transform var(--transition-fast); }
      .faq-item.open .faq-question iconify-icon { transform: rotate(45deg); }
      .faq-answer {
      display: grid;
      grid-template-rows: 0fr;
      transition: grid-template-rows var(--transition-base);
      }
      .faq-answer-inner {
      overflow: hidden;
      color: var(--color-mid);
      font-size: var(--text-sm);
      }
      .faq-answer p {
      max-width: 66ch;
      margin: 0;
      padding-bottom: 0;
      }
      .faq-item.open .faq-answer { grid-template-rows: 1fr; }
      .faq-item.open .faq-answer p { padding-bottom: var(--space-6); }
      .question-card {
      position: sticky;
      top: calc(var(--header-height) + var(--space-6));
      grid-column: span 4;
      align-self: start;
      padding: var(--space-8);
      border-radius: var(--radius-lg);
      background: var(--color-accent);
      }
      .question-card h3 {
      font-size: var(--text-2xl);
      }
      .question-card p {
      margin-bottom: var(--space-6);
      font-size: var(--text-sm);
      }
      .question-card .button {
      width: 100%;
      }
      .site-footer {
      position: relative;
      overflow: hidden;
      padding: var(--space-20) 0 var(--space-6);
      background: var(--color-ink);
      color: var(--color-paper);
      }
      .footer-wordmark::before { content: attr(data-text); }
      .footer-wordmark {
      position: absolute;
      top: calc(var(--space-8) * -1);
      left: 50%;
      z-index: 0;
      color: var(--color-mid);
      font-family: var(--font-display);
      font-size: clamp(var(--text-5xl), 15vw, 14rem);
      font-weight: 600;
      letter-spacing: -0.1em;
      line-height: 0.8;
      opacity: 0.24;
      transform: translateX(-50%);
      white-space: nowrap;
      }
      .footer-content { position: relative; z-index: 1; }
      .footer-grid {
      display: grid;
      grid-template-columns: 2fr repeat(3, 1fr);
      gap: var(--space-8);
      padding-top: var(--space-16);
      padding-bottom: var(--space-16);
      }
      .footer-grid h3 {
      margin-bottom: var(--space-5);
      font-size: var(--text-sm);
      letter-spacing: -0.02em;
      }
      .footer-grid a,
      .footer-grid p {
      display: block;
      margin-bottom: var(--space-3);
      color: var(--color-line);
      font-size: var(--text-xs);
      }
      .footer-grid a:hover { color: var(--color-accent); }
      .footer-contact .wordmark {
      display: block;
      margin-bottom: var(--space-5);
      color: var(--color-paper);
      }
      .footer-bottom {
      display: flex;
      justify-content: space-between;
      gap: var(--space-4);
      padding-top: var(--space-5);
      border-top: var(--line-thin) solid var(--color-mid);
      color: var(--color-line);
      font-size: var(--text-xs);
      }
      .contact-panel {
      position: fixed;
      z-index: 40;
      top: 0;
      right: 0;
      display: flex;
      flex-direction: column;
      width: min(100%, var(--panel-width));
      height: 100dvh;
      padding: var(--space-8);
      background: var(--color-paper);
      box-shadow: var(--shadow-panel);
      transform: translateX(100%);
      transition: transform var(--transition-base);
      }
      .contact-panel.open { transform: translateX(0); }
      .panel-top {
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding-bottom: var(--space-6);
      border-bottom: var(--line-thin) solid var(--color-line);
      }
      .panel-top h2 {
      margin: 0;
      font-size: var(--text-2xl);
      }
      .close-panel {
      display: grid;
      width: var(--space-10);
      height: var(--space-10);
      place-items: center;
      border: var(--line-thin) solid var(--color-line);
      border-radius: var(--radius-pill);
      background: transparent;
      color: var(--color-ink);
      }
      .contact-panel form {
      display: grid;
      gap: var(--space-5);
      padding-top: var(--space-8);
      }
      .field-label {
      display: block;
      margin-bottom: var(--space-2);
      font-size: var(--text-xs);
      text-transform: uppercase;
      }
      .field {
      width: 100%;
      padding: var(--space-4);
      border: var(--line-thin) solid var(--color-line);
      border-radius: var(--radius-sm);
      outline: none;
      background: var(--color-paper);
      color: var(--color-ink);
      font-size: var(--text-sm);
      }
      .field:focus { border-color: var(--color-ink); }
      textarea.field { min-height: 7rem; resize: vertical; }
      .panel-note {
      margin-top: auto;
      color: var(--color-mid);
      font-size: var(--text-xs);
      }
      .overlay {
      position: fixed;
      z-index: 30;
      inset: 0;
      display: none;
      background: rgba(17, 17, 17, 0.36);
      }
      .overlay.open { display: block; }
      .js .fade-up {
      opacity: 0;
      transform: translateY(var(--space-6));
      transition: opacity 650ms ease, transform 650ms ease;
      }
      .js .fade-up.visible {
      opacity: 1;
      transform: translateY(0);
      }
      @keyframes move-left {
      to { transform: translateX(-50%); }
      }
      @keyframes move-right {
      from { transform: translateX(-50%); }
      to { transform: translateX(0); }
      }
      @media (max-width: 60rem) {
      .primary-nav,
      .header-phone { display: none; }
      .header-inner { grid-template-columns: 1fr auto auto; }
      .menu-button {
      display: grid;
      width: var(--space-10);
      height: var(--space-10);
      place-items: center;
      border: var(--line-thin) solid var(--color-line);
      border-radius: var(--radius-pill);
      background: transparent;
      }
      .hero { padding-top: var(--space-16); }
      .hero-copy,
      .hero-visual,
      .service-list,
      .service-preview,
      .faq-list,
      .question-card {
      grid-column: span 12;
      }
      .hero-visual {
      padding-top: var(--space-8);
      padding-left: 0;
      }
      .job-card { right: var(--space-4); }
      .service-preview .image-block { min-height: 22rem; }
      .why-grid { grid-template-columns: repeat(2, 1fr); }
      .why-card.featured { grid-column: span 2; }
      .stats-grid { grid-template-columns: repeat(2, 1fr); }
      .stat:nth-child(2) { border-right: 0; }
      .stat:nth-child(-n + 2) { border-bottom: var(--line-thin) solid var(--color-ink); padding-bottom: var(--space-5); }
      .jobs-grid { grid-template-columns: repeat(2, 1fr); }
      .question-card {
      position: static;
      margin-top: var(--space-2);
      }
      .footer-grid { grid-template-columns: repeat(2, 1fr); }
      .footer-contact { grid-column: span 2; }
      }
      @media (max-width: 42rem) {
      .shell { width: min(calc(100% - var(--space-8)), var(--content-width)); }
      .header-inner { gap: var(--space-2); }
      .header-inner > .button { padding-inline: var(--space-4); }
      section { padding: var(--space-16) 0; }
      .section-head,
      .cta-inner,
      .footer-bottom {
      align-items: flex-start;
      flex-direction: column;
      }
      .why-grid,
      .jobs-grid,
      .stats-grid {
      grid-template-columns: 1fr;
      }
      .why-card.featured { grid-column: span 1; grid-row: span 1; }
      .stat,
      .stat:nth-child(2) {
      padding-bottom: var(--space-5);
      border-right: 0;
      border-bottom: var(--line-thin) solid var(--color-ink);
      }
      .stat:last-child { border-bottom: 0; }
      .footer-grid { grid-template-columns: 1fr 1fr; gap: var(--space-6); }
      .footer-contact { grid-column: span 2; }
      .testimonial-card { width: 18rem; }
      .job-card { width: 78%; bottom: var(--space-3); }
      }
      @media (prefers-reduced-motion: reduce) {
      html { scroll-behavior: auto; }
      *, *::before, *::after {
      animation-duration: 1ms !important;
      animation-iteration-count: 1 !important;
      transition-duration: 1ms !important;
      }
      .js .fade-up, .js .fade-up.visible { opacity: 1; transform: none; }
      }