/* Route layout only: brand tokens and existing component treatments stay shared. */
html { scroll-behavior: auto; scrollbar-gutter: stable; }
main { min-height: calc(100dvh - 72px); }
[data-page-view] { min-width: 0; }
[data-page-view="projects"] .projects { overflow: clip; }
[data-page-view] > .section:first-child { padding-top: 132px; }
.page-title { margin: 0; font-family: var(--font-display); font-size: clamp(2.8rem,5vw,5.8rem); font-weight: 650; letter-spacing: -.065em; line-height: 1.02; text-wrap: balance; }
.page-title:focus { outline: none; }
.hero-title:focus { outline: none; }
.automation-library .page-title { color: var(--ink); }
.automation-library .page-title em { color: var(--gold-dark); }
.automation-library { background: var(--paper); color: var(--ink); --archive-muted: var(--charcoal); }
.automation-library::before, .automation-library::after { display: none; }
.automation-library__disciplines { color: var(--charcoal); }
/* The archive folders remain charcoal objects, not a separate page theme. */
.business-folder { --archive-muted: #aaa69d; }
.capability-strip { position: relative; background: var(--ivory); color: var(--ink); border-color: var(--line); mask-image: none; -webkit-mask-image: none; }
.capability-strip__track span { color: var(--charcoal); }
.capability-strip[data-playing="true"] .capability-strip__track { animation: capabilityRail 24s linear infinite !important; }
.capability-strip[data-playing="false"] .capability-strip__track { animation-play-state: paused !important; }
.ticker-toggle { position: absolute; right: 8px; top: 50%; transform: translateY(-50%); z-index: 2; min-height: 34px; padding: 6px 12px; background: #fff; color: var(--ink); border: 1px solid var(--line); border-radius: 4px; cursor: pointer; font-size: 11px; }
.primary-nav a[aria-current="page"] { color: var(--gold-dark); }
.site-footer nav a[aria-current="page"] { color: #c8a45b; }
body.navigation-open { overflow: hidden; }
@media (min-width:961px) { .primary-nav { gap: clamp(12px,1.4vw,26px); } }

/* The photograph supports the copy, with its original 4:5 framing intact. */
.hero { min-height: 0; padding: 108px 0 28px; background: var(--paper); }
.hero::before, .hero-grid { display: none; }
.ticker-toggle { background: var(--ivory); }
.hero__layout { max-width: none; min-height: 0; grid-template-columns: minmax(0,1.85fr) minmax(0,1fr); gap: 24px 64px; align-items: center; }
.hero__copy { padding: 0; }
.hero-title { font-size: clamp(3rem,4.2vw,5rem); line-height: 1.04; letter-spacing: -.07em; }
.hero__summary { margin-top: 1.7rem; font-size: .94rem; }
.hero__platforms { margin: 1.7rem 0 0; }
.hero__visual { width: 100%; max-width: clamp(270px, calc((100svh - 380px) * .8), 360px); min-height: 0; aspect-ratio: 4 / 5; justify-self: end; margin-right: 20px; }
.hero__portrait-frame { inset: 0; }
.hero__portrait-frame img { object-fit: cover; object-position: center; transform: none; translate: none; }
.hero__portrait-frame::before { top: 14px; right: 12px; font-size: .44rem; }
.hero__flow { right: 10px; bottom: 12px; max-width: calc(100% - 20px); padding: .7rem; font-size: .4rem; gap: .45rem; overflow: hidden; }
.system-node { font-size: .44rem; padding: .55rem; }
.system-node--crm { top: 15%; left: -18px; }
.system-node--workflow { top: 34%; right: -12px; }
.system-node--api { top: 55%; left: -18px; }
.system-node--ai { bottom: 28%; right: -12px; }
.system-node--lead { bottom: 14%; left: -18px; }
.hero-method { grid-column: 1 / -1; padding-top: 22px; border-top: 1px solid var(--line); }
.hero-method h2 { margin: 0 0 20px; font-size: clamp(1.25rem,1.8vw,1.5rem); letter-spacing: -.04em; line-height: 1.25; }
.hero-method ol { display: grid; grid-template-columns: repeat(6,minmax(0,1fr)); gap: 24px; margin: 0; }
.hero-method li { min-width: 0; }
.hero-method__number { display: block; margin-bottom: 7px; color: var(--gold-dark); font-size: .61rem; font-weight: 700; }
.hero-method h3 { margin: 0 0 7px; font-size: .82rem; }
.hero-method p { margin: 0; color: var(--charcoal); font-size: .7rem; line-height: 1.6; }

/* Full case studies use a consistent grid. */
[data-page-view="projects"] .project-list { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 30px; padding: 0; overflow: visible; cursor: auto; }
[data-page-view="projects"] .case-study,
[data-page-view="projects"] .case-study:first-child { display: flex; flex-direction: column; width: 100%; min-width: 0; flex-basis: auto; grid-column: auto; }
[data-page-view="projects"] .case-study__body h3 { font-size: clamp(1.8rem,2.7vw,2.75rem); }
[data-page-view="projects"] .case-study__body { padding: 28px; }
[data-page-view="projects"] .case-study__actions { flex-direction: row; }
[data-page-view="projects"] .case-study__visual { aspect-ratio: 16/10; }
[data-page-view="projects"] .case-study__media { display: block; height: 100%; }
.page-consultation { padding: 58px 0; background: var(--ink); color: var(--paper); }
.page-consultation__inner { display: flex; align-items: center; justify-content: flex-start; gap: 48px; }
.page-consultation .eyebrow { color: #c8a45b; }
.page-consultation h2 { margin: 0; font-size: clamp(1.8rem,3vw,3rem); letter-spacing: -.05em; line-height: 1.1; }
.page-consultation .button { border-color: var(--gold); }
.about__layout { grid-template-columns: minmax(0,.78fr) minmax(0,1.22fr); align-items: center; }
.about__portrait { min-height: 0; width: 100%; max-width: 430px; aspect-ratio: 4/5; justify-self: center; }
.about__portrait img { inset: 0; width: 100%; height: 100%; object-position: center; }
.about__portrait::before { inset: 12px -12px -12px 12px; }
.about__copy .page-title { margin-bottom: 30px; }
.about__copy p { font-size: .95rem; }
.contact-methods { background: var(--paper); }
.contact-methods__layout { display: grid; grid-template-columns: 1fr 1fr; gap: 70px; align-items: start; }
.contact-methods h2 { font-size: clamp(2rem,3.4vw,3.5rem); letter-spacing: -.06em; line-height: 1.1; }
.contact-methods p { color: var(--charcoal); max-width: 54ch; }
.contact-expectation { font-size: .85rem; }
.contact-methods__links a { position: relative; display: block; padding: 24px 28px 24px 0; border-bottom: 1px solid var(--line); }
.contact-methods__links span { display: block; color: var(--gold-dark); font-size: .7rem; margin-bottom: 8px; }
.contact-methods__links strong { font-size: clamp(1rem,1.7vw,1.5rem); overflow-wrap: anywhere; }
.contact-methods__links b { position: absolute; right: 0; top: 42px; color: var(--gold-dark); }
@media (max-width:1100px) {
  .hero__layout { gap: 32px; grid-template-columns: minmax(0,1.5fr) minmax(0,1fr); }
  .hero__visual { max-width: 380px; }
  .hero-title { font-size: clamp(2.65rem,5vw,3.6rem); }
  .hero-method ol { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 22px 32px; }
  .hero-method li { display: flex; gap: 12px; }
  .hero-method__number { padding-top: 2px; }
  .hero-method p { font-size: .75rem; }
}
@media (max-width:960px) {
  .page-consultation__inner { flex-direction: column; align-items: flex-start; gap: 24px; }
  .primary-nav { top: 76px; }
  .primary-nav a[aria-current="page"] { background: var(--gold-pale); border-radius: 4px; }
  .hero__layout { grid-template-columns: minmax(0,1.2fr) minmax(0,1fr); gap: 30px; }
  .hero__actions { gap: 18px; align-items: flex-start; }
  .hero__summary { font-size: .86rem; }
  .hero-title { font-size: clamp(2.5rem,4.7vw,3.3rem); }
  .hero__visual { max-width: 340px; }
  .hero__flow { font-size: .34rem; gap: .3rem; padding: .6rem .4rem; }
  .hero__flow i { width: 8px; }
  .about__layout { grid-template-columns: minmax(0,.8fr) minmax(0,1.2fr); gap: 36px; }
  .about__portrait { max-width: 350px; }
  .contact-methods__layout { gap: 36px; }
}
@media (max-width:700px) {
  .reliability-map { min-height: 430px; }
  .reliability-flow { display: grid; grid-template-columns: minmax(0,1fr) 16px minmax(0,1fr); gap: 28px 12px; }
  .reliability-flow > span { min-width: 0; width: 100%; }
  .reliability-flow { overflow: visible; }
  .reliability-flow > i { width: 16px; }
  .reliability-flow > span b { width: 115%; }
  .reliability-flow > i:nth-of-type(2) { display: none; }
  [data-page-view] > .section:first-child { padding-top: 110px; }
  .hero { padding: 110px 0 44px; }
  .hero__layout { grid-template-columns: 1fr; gap: 38px; }
  .hero-title { font-size: clamp(2.5rem,9.7vw,3.6rem); line-height: 1.02; }
  .hero-title span { display: inline; }
  .hero__summary { font-size: .9rem; }
  .hero__actions { flex-direction: row; flex-wrap: wrap; align-items: center; }
  .hero__visual { width: 86%; max-width: 320px; justify-self: center; margin-right: 0; }
  .hero-method { padding-top: 26px; }
  .hero-method h2 { max-width: 28ch; font-size: 1.4rem; }
  .hero-method ol { grid-template-columns: 1fr; gap: 20px; }
  .hero-method li { gap: 18px; }
  .hero-method h3 { font-size: .9rem; }
  .hero-method p { font-size: .82rem; max-width: 42ch; }
  [data-page-view="projects"] .project-list { grid-template-columns: 1fr; gap: 28px; }
  [data-page-view="projects"] .case-study__body { padding: 22px; }
  .page-consultation__inner { flex-direction: column; align-items: flex-start; }
  .page-title { font-size: clamp(2.5rem,10vw,3.6rem); }
  .about__layout { grid-template-columns: 1fr; }
  .about__copy { order: -1; }
  .about__portrait { width: 86%; max-width: 320px; }
  .contact-methods__layout { grid-template-columns: 1fr; gap: 16px; }
}
/* Keep the complete introduction visible on shorter desktop windows too. */
@media (min-width:1101px) and (max-height:800px) {
  .hero { padding-top: 96px; padding-bottom: 20px; }
  .hero-title { font-size: clamp(2.65rem,3.6vw,3.25rem); }
  .hero__copy > .eyebrow { margin-bottom: 16px; }
  .hero__summary, .hero__actions { margin-top: 20px; }
  .hero__platforms { margin-top: 20px; padding-top: 12px; }
  .hero-method { padding-top: 16px; }
  .hero-method h2 { margin-bottom: 14px; font-size: 1.35rem; }
}
@media (prefers-reduced-motion:reduce) {
  .capability-strip__track { animation: none !important; }
  .hero-method * { transition: none; }
}
.website-projects {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;margin-top:48px}
.website-project {display:flex;flex-direction:column;overflow:hidden;border:1px solid #d5d5cf;border-radius:8px;color:var(--ink);text-decoration:none;background:#fff}
.website-project__preview {display:block;width:100%;height:auto;aspect-ratio:1.6;object-fit:cover;object-position:top;border-bottom:1px solid #e3e3de}
.website-project__body {display:flex;flex-direction:column;flex:1;padding:28px}
.website-project .website-project__category {font-size:12px;color:#7b6026;margin:0}
.website-project .sr-only {position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.website-project h2 {font-size:clamp(25px,2.5vw,36px);line-height:1.15;margin:12px 0 16px}
.website-project .website-project__description {font-size:16px;line-height:1.65;margin:0 0 20px;color:#54595c;max-width:60ch}
.website-project .website-project__features {font-size:12px;line-height:1.7;color:#646866;margin:0 0 24px}
.website-project strong {display:flex;justify-content:space-between;gap:16px;margin-top:auto;padding-top:18px;border-top:1px solid #e3e3de;color:var(--ink);font-size:14px}
.website-project strong > span[aria-hidden] {color:var(--gold)}
.website-project:hover {border-color:var(--gold)}
.website-project:focus-visible {outline:2px solid var(--gold);outline-offset:5px}
@media(max-width:700px){.website-projects{grid-template-columns:1fr}.website-project__body{padding:22px}}