/* Page composition for the isolated Five One Nine preview. Component primitives remain in components.css. */
html { scroll-behavior: smooth; }
body { margin: 0; overflow-x: hidden; color: var(--semantic-color-foreground); background: var(--semantic-color-background); font-family: var(--primitive-font-family-body); font-size: 1rem; line-height: 1.6; }
* { box-sizing: border-box; }
img { display: block; max-width: 100%; height: auto; }
a { color: inherit; text-underline-offset: .2em; }
button, input, textarea, select { font: inherit; }
button { color: inherit; }
h1, h2, h3, p, ul, ol, figure { margin-top: 0; }
h1, h2, h3 { font-family: var(--primitive-font-family-display); line-height: 1.02; letter-spacing: -.035em; }
h1 { max-width: 14ch; margin-bottom: 1.5rem; font-size: clamp(3rem, 11vw, 8.75rem); font-weight: var(--primitive-font-weight-bold); }
h2 { max-width: 18ch; margin-bottom: 1.25rem; font-size: clamp(2.25rem, 6vw, 5.4rem); }
h3 { margin-bottom: .65rem; font-size: clamp(1.35rem, 2.5vw, 2rem); }
p { max-width: 66ch; }
address { font-style: normal; }
.page-wrapper { min-height: 100vh; }
.padding-global { padding-right: 1.25rem; padding-left: 1.25rem; }
.container-large { width: 100%; max-width: var(--semantic-layout-container); margin-right: auto; margin-left: auto; }
.padding-section-large { padding-top: clamp(4.5rem, 10vw, 8rem); padding-bottom: clamp(4.5rem, 10vw, 8rem); }
.section_accent { background: var(--semantic-color-surface-muted); }
.section_cta { background: var(--semantic-color-surface-dark); color: var(--primitive-color-paper); }
.skip-link { position: fixed; z-index: 100; top: 1rem; left: 1rem; padding: .75rem 1rem; background: var(--primitive-color-paper); color: var(--primitive-color-ink); transform: translateY(-160%); }
.skip-link:focus { transform: translateY(0); }
.eyebrow { margin-bottom: 1rem; font-size: .75rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; }
.hero_intro { max-width: 45rem; margin-bottom: 2rem; font-size: clamp(1.15rem, 2vw, 1.5rem); }
.section-heading_component { display: grid; gap: .4rem; margin-bottom: clamp(2.5rem, 6vw, 5rem); }
.section-heading_component > p:last-child { font-size: 1.125rem; }
.button_group { display: flex; flex-wrap: wrap; gap: .75rem; }
.text-link { display: inline-flex; min-height: 48px; align-items: center; gap: .65rem; font-weight: 700; }
.text-link span { color: var(--semantic-color-action); }

.nav_component { position: sticky; z-index: 50; top: 0; border-bottom: 1px solid var(--primitive-color-soft); background: rgba(255,255,255,.95); backdrop-filter: blur(14px); }
.nav_inner { max-width: var(--semantic-layout-container); min-height: 5rem; margin: 0 auto; padding: .75rem 1.25rem; }
.brand_mark { display: flex; align-items: center; }
.brand_mark img { width: 3.25rem; height: 3.25rem; object-fit: contain; }
.menu_button { min-width: 48px; min-height: 48px; padding: .65rem 1rem; border: 1px solid var(--primitive-color-ink); border-radius: var(--semantic-control-radius); background: transparent; font-weight: 700; }
.nav_link-list, .nav_action { display: none; }
.mobile-nav_component { padding: .5rem 1.25rem 1.25rem; border-top: 1px solid var(--primitive-color-soft); }
.mobile-nav_component nav { display: grid; gap: .35rem; }
.mobile-nav_component .nav_link { min-height: 48px; padding: .7rem 0; font-size: 1.15rem; }
.mobile-nav_component[hidden] { display: none; }

.section_hero { background: var(--primitive-color-ink); color: var(--primitive-color-paper); }
.section_hero .padding-global { padding-right: 0; padding-left: 0; }
.section_hero .container-large { max-width: none; }
.section_hero .padding-section-large { padding: 0; }
.hero_component { display: grid; min-height: min(820px, calc(100vh - 5rem)); padding: clamp(3rem, 8vw, 7rem) 1.25rem; }
.hero_component.theme_light { background: var(--primitive-color-paper); color: var(--primitive-color-ink); }
.hero_copy { align-self: end; }
.hero_evidence-rail { display: grid; align-self: end; margin: 3rem 0 0; padding: 0; list-style: none; border-top: 1px solid currentColor; }
.hero_evidence-rail li { display: grid; grid-template-columns: 3rem 1fr; gap: 1rem; padding: 1rem 0; border-bottom: 1px solid currentColor; }
.hero_evidence-rail span, .service-index_number, .process_step > span, .prompt-grid_component span, .principle-grid_component > article > span { color: var(--semantic-color-action); font-weight: 700; }

.service-index_component { border-top: 2px solid var(--primitive-color-ink); }
.service-index_item { display: grid; grid-template-columns: 2.5rem 1fr; gap: 1rem; padding: 1.5rem 0; border-bottom: 1px solid var(--primitive-color-ink); }
.service-index_item .button { grid-column: 2; justify-self: start; }
.process_component { display: grid; gap: 3rem; }
.process_component ol { margin: 0; padding: 0; list-style: none; }
.process_step { display: grid; grid-template-columns: 3rem 1fr; gap: 1rem; padding: 1.5rem 0; border-top: 1px solid var(--primitive-color-ink); }
.process_step:last-child { border-bottom: 1px solid var(--primitive-color-ink); }

.project-index_component { display: grid; gap: 2rem; }
.project-card_component { display: grid; border-top: 2px solid var(--primitive-color-ink); }
.project-card_media { overflow: hidden; aspect-ratio: 16/10; background: var(--primitive-color-soft); }
.project-card_media img { width: 100%; height: 100%; object-fit: cover; transition: transform var(--semantic-motion-duration) cubic-bezier(var(--semantic-motion-easing)); }
.project-card_component:hover img { transform: scale(1.025); }
.project-card_content { padding: 1.5rem 0 2rem; }
.project-card_fallback { display: grid; width: 100%; height: 100%; place-items: center; background: var(--primitive-color-ink); color: var(--primitive-color-paper); font-size: clamp(2.5rem, 8vw, 6rem); font-weight: 700; letter-spacing: -.05em; }
.belief-grid_component, .scope-sheet_component, .contact-layout_component, .project-record_component, .service-detail_component, .support-page_component { display: grid; gap: 2.5rem; }
.evidence-note_component { padding: 1.5rem; border-left: .35rem solid var(--semantic-color-action); background: var(--primitive-color-paper); }
.evidence-note_component h3 { margin-top: 1.5rem; }
.evidence-note_component h3:first-child { margin-top: 0; }
.cta_component { display: grid; gap: 2rem; align-items: end; }
.cta_component .button { justify-self: start; }

.related-services_component ul, .decision-checklist_component ol, .decision-checklist_component ul, .service-detail_scope, .project-record_component ol, .scope-sheet_component ul { margin: 0; padding: 0; list-style: none; }
.related-services_component li, .decision-checklist_item, .decision-checklist_component > ul > li, .service-detail_scope li, .project-record_component ol li, .scope-sheet_component li { display: grid; grid-template-columns: 3rem 1fr; gap: 1rem; padding: 1rem 0; border-top: 1px solid var(--primitive-color-ink); }
.related-services_component li { grid-template-columns: 1fr auto; }
.related-services_component li p { grid-column: 1 / -1; margin-bottom: 0; }
.related-services_component li:last-child, .decision-checklist_component li:last-child, .service-detail_scope li:last-child, .project-record_component ol li:last-child, .scope-sheet_component li:last-child { border-bottom: 1px solid var(--primitive-color-ink); }
.related-services_component a { font-size: clamp(1.35rem, 3vw, 2.2rem); font-weight: 700; text-decoration: none; }
.related-services_component a:hover { text-decoration: underline; }
.related-services_arrow { color: var(--semantic-color-action); }
.prompt-grid_component { display: grid; border-top: 2px solid var(--primitive-color-ink); }
.prompt-grid_component article { min-height: 12rem; padding: 1.5rem 0; border-bottom: 1px solid var(--primitive-color-ink); }
.prompt-grid_component p { margin: 2rem 0 0; font-size: 1.2rem; }
.artifact_small { align-self: end; max-width: 16rem; }
.artifact_small img { max-height: 11rem; object-fit: contain; }
.artifact_small p { margin: .75rem 0 0; font-weight: 700; }
.principle-grid_component { display: grid; gap: 2rem; }
.principle-grid_component article { min-height: 14rem; padding-top: 1rem; border-top: 2px solid var(--primitive-color-ink); }
.principle-grid_component h3 { margin-top: 3rem; }
.project-artifact_component { margin: 0; }
.project-artifact_component img { width: 100%; max-height: 52rem; object-fit: cover; }
.project-artifact_component figcaption { padding: .75rem 0; color: var(--semantic-color-text-muted); }
.project-hero_fallback { display: grid; min-height: 28rem; place-items: center; background: var(--primitive-color-ink); color: var(--primitive-color-paper); text-align: center; }
.project-hero_fallback span { display: block; font-size: clamp(6rem, 26vw, 18rem); font-weight: 700; line-height: .8; letter-spacing: -.08em; }
.project-hero_fallback p { margin: 2rem 0 0; }
.address-block_component address { margin: 1.5rem 0; font-size: clamp(1.4rem, 3vw, 2rem); font-weight: 700; line-height: 1.3; }

.form_component { padding: 1.5rem; border: 1px solid var(--primitive-color-ink); background: var(--primitive-color-paper); }
.form_notice { padding-bottom: 1rem; border-bottom: 1px solid var(--primitive-color-soft); color: var(--semantic-color-text-muted); }
.form_field-wrapper { margin-bottom: 1.25rem; }
.form_label { display: block; margin-bottom: .4rem; font-weight: 700; }
.form_label span { color: var(--semantic-color-text-muted); font-size: .85rem; font-weight: 400; }
.form_input { width: 100%; min-height: 48px; padding: .8rem; border: 1px solid var(--primitive-color-ink); border-radius: var(--semantic-control-radius); background: var(--primitive-color-paper); color: var(--primitive-color-ink); }
textarea.form_input { resize: vertical; }
.form_input.is-error { border-width: 2px; border-color: var(--semantic-color-error); }
.form_error { display: block; min-height: 1.3rem; margin-top: .25rem; color: var(--semantic-color-error); font-size: .875rem; }
.form_message { margin-bottom: 1.25rem; padding: 1rem; border-left: .35rem solid currentColor; }
.form_message.is-error { color: var(--semantic-color-error); background: #fff2f2; }
.form_message ul { margin: .5rem 0 0; }
.form_split { display: grid; }
.direct-contact_component { display: grid; gap: 1rem; }
.direct-contact_item { padding: 1.5rem 0; border-top: 2px solid var(--primitive-color-ink); }
.direct-contact_item h2 { max-width: none; overflow-wrap: anywhere; font-size: clamp(1.7rem, 5vw, 3.5rem); }
.support-page_status { padding: 1.5rem; border: 1px solid var(--primitive-color-ink); }

.footer_component { padding: 4rem 1.25rem 1.5rem; background: var(--primitive-color-ink); color: var(--primitive-color-paper); }
.footer_grid { display: grid; max-width: var(--semantic-layout-container); margin: 0 auto; gap: 2.5rem; }
.footer_grid > div { display: flex; flex-direction: column; align-items: flex-start; gap: .65rem; }
.footer_brand { font-size: 2rem; font-weight: 700; text-decoration: none; }
.footer_heading { margin: 0 0 .5rem; font-size: .8rem; letter-spacing: .14em; text-transform: uppercase; }
.footer_grid a:not(.button) { min-height: 2.25rem; }
.footer_meta { display: flex; max-width: var(--semantic-layout-container); margin: 3rem auto 0; padding-top: 1.5rem; border-top: 1px solid #444; flex-wrap: wrap; justify-content: space-between; gap: 1rem; color: #bbb; font-size: .8rem; }

.review-index_component { padding: 2rem; background: var(--primitive-color-paper); }
.review-index_component main { max-width: 70rem; margin: 0 auto; }
.review-index_component h1 { color: var(--primitive-color-ink); }
.review-index_component ol { margin: 2rem 0; padding: 0; list-style: none; border-top: 2px solid var(--primitive-color-ink); }
.review-index_component li { display: grid; gap: .5rem; padding: 1rem 0; border-bottom: 1px solid var(--primitive-color-ink); }
.review-index_component a { font-weight: 700; }

/* Dark surface button contract. Every control declares its own foreground,
   fill, and border instead of inheriting the paper scheme. */
.section_hero .button,
.section_cta .button,
.footer_component .button,
.scheme-card.is-dark .button { background: var(--primitive-color-paper); color: var(--primitive-color-ink); border-color: var(--primitive-color-paper); }
.section_hero .button:hover,
.section_cta .button:hover,
.footer_component .button:hover,
.scheme-card.is-dark .button:hover { background: var(--primitive-color-soft); color: var(--primitive-color-ink); border-color: var(--primitive-color-soft); }
.section_hero .button.is-secondary,
.section_cta .button.is-secondary,
.footer_component .button.is-secondary,
.scheme-card.is-dark .button.is-secondary { background: transparent; color: var(--primitive-color-paper); border-color: var(--primitive-color-paper); }
.section_hero .button.is-secondary:hover,
.section_cta .button.is-secondary:hover,
.footer_component .button.is-secondary:hover,
.scheme-card.is-dark .button.is-secondary:hover { background: var(--primitive-color-paper); color: var(--primitive-color-ink); }
.section_hero .hero_component.theme_light .button {
  color: var(--primitive-color-paper);
  background: var(--primitive-color-ink);
  border-color: var(--primitive-color-ink);
}
.section_hero .hero_component.theme_light .button.is-secondary {
  color: var(--primitive-color-ink);
  background: transparent;
  border-color: var(--primitive-color-ink);
}
.theme_dark .hero_evidence-rail span { color: var(--semantic-color-accent-on-dark); }
.theme_light .hero_evidence-rail span { color: var(--semantic-color-accent-on-light); }

/* Service routes share tokens, not silhouettes. Each route exposes a distinct
   decision artifact and a different section sequence from the generator. */
.section_service-artifact { border-top: 1px solid var(--primitive-color-ink); border-bottom: 1px solid var(--primitive-color-ink); }
.service-route_artifact > h2 { max-width: 15ch; }
.service-route_blueprint { display: grid; border: 2px solid var(--primitive-color-ink); }
.service-route_blueprint article { min-height: 13rem; padding: 1.5rem; border-bottom: 1px solid var(--primitive-color-ink); }
.service-route_blueprint article:last-child { border-bottom: 0; }
.service-route_blueprint span, .service-route_identity-board dt, .service-route_content-rhythm span, .service-route_search-path span, .service-route_campaign-path span, .service-route_workflow-map span { color: var(--semantic-color-accent-on-light); font-size: .75rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.service-route_blueprint p { margin-top: 4rem; font-size: 1.25rem; font-weight: 700; }
.service-route_identity-board { display: grid; gap: 2rem; }
.service-route_identity-board blockquote { margin: 0; padding: 0 0 1rem 1.5rem; border-left: .4rem solid var(--semantic-color-action); font-size: clamp(1.8rem, 5vw, 4rem); font-weight: 700; line-height: 1.05; }
.service-route_identity-board dl { margin: 0; border-top: 2px solid var(--primitive-color-ink); }
.service-route_identity-board dl div { display: grid; grid-template-columns: 6rem 1fr; gap: 1rem; padding: 1rem 0; border-bottom: 1px solid var(--primitive-color-ink); }
.service-route_identity-board dd { margin: 0; }
.service-route_content-rhythm { display: grid; margin: 0; padding: 0; list-style: none; counter-reset: rhythm; }
.service-route_content-rhythm li { display: grid; grid-template-columns: 4rem 1fr; min-height: 7rem; align-items: center; padding: 1rem 0; border-top: 1px solid var(--primitive-color-ink); }
.service-route_content-rhythm li:nth-child(even) { padding-left: clamp(1rem, 8vw, 7rem); background: var(--primitive-color-soft); }
.service-route_search-path { display: grid; margin: 0; padding: 0; list-style: none; border-left: .35rem solid var(--semantic-color-action); }
.service-route_search-path li { display: grid; grid-template-columns: 4rem 1fr; gap: 1rem; padding: 1.5rem; border-bottom: 1px solid var(--primitive-color-ink); }
.service-route_search-path p, .service-route_campaign-path p, .service-route_workflow-map p { margin: 0; font-weight: 700; }
.section_service-artifact.is-campaign-path { background: var(--primitive-color-soft); }
.service-route_campaign-path { display: grid; gap: .75rem; }
.service-route_campaign-path > div { display: grid; grid-template-columns: 3rem 1fr; gap: 1rem; padding: 1.25rem; border: 2px solid var(--primitive-color-ink); background: var(--primitive-color-paper); }
.service-route_campaign-path > div:nth-child(even) { transform: translateX(clamp(.5rem, 4vw, 3rem)); }
.service-route_workflow-map { display: grid; gap: 0; }
.service-route_workflow-map > div { display: grid; grid-template-columns: 3rem 1fr; gap: 1rem; max-width: 34rem; padding: 1.25rem; border: 2px solid var(--primitive-color-ink); }
.service-route_workflow-map > div + div { margin-top: -2px; }
.service-route_workflow-map > div:nth-child(even) { margin-left: auto; }
.section_service-scope.is-identity-board .service-detail_component,
.section_service-proof.is-search-path .project-record_component,
.section_service-proof.is-workflow-map .project-record_component { grid-template-columns: minmax(0,1.25fr) minmax(14rem,.75fr); }
.section_service-checklist.is-campaign-path { background: var(--primitive-color-ink); color: var(--primitive-color-paper); }
.section_service-checklist.is-campaign-path li { border-color: var(--primitive-color-paper); }

/* Project route variants preserve the evidence record while changing the
   document shape for agency, commerce, compliance, and booking work. */
.section_project-artifact.is-agency-brief .project-artifact_component { width: min(88%, 62rem); }
.section_project-artifact.is-agency-brief figure { border-left: .5rem solid var(--semantic-color-action); }
.section_project-record.is-commerce-build .project-record_component ol { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 1px; background: var(--primitive-color-ink); }
.section_project-record.is-commerce-build .project-record_component ol li { min-height: 10rem; padding: 1.5rem; border: 0; background: var(--primitive-color-paper); }
.section_project-artifact.is-commerce-build .project-artifact_component { width: min(82%, 58rem); margin-left: auto; transform: rotate(-1deg); }
.section_project-artifact.is-compliance-record { background: var(--primitive-color-ink); color: var(--primitive-color-paper); }
.section_project-artifact.is-compliance-record .project-artifact_component { display: grid; grid-template-columns: minmax(0,1fr) minmax(12rem,.35fr); align-items: end; gap: 2rem; }
.section_project-artifact.is-compliance-record figcaption { color: var(--primitive-color-paper); border-top: 1px solid var(--primitive-color-paper); }
.section_project-evidence.is-compliance-record { background: var(--primitive-color-paper); }
.section_project-evidence.is-compliance-record .evidence-note_component { max-width: 48rem; margin-left: auto; border-top: 2px solid var(--primitive-color-ink); border-left-width: 0; }
.section_project-artifact.is-booking-flow .project-hero_fallback { min-height: min(70vh, 44rem); border: 1rem solid var(--primitive-color-soft); }
.section_project-record.is-booking-flow .project-record_component { display: block; }
.section_project-record.is-booking-flow .project-record_component ol { display: grid; margin-top: 3rem; }

[data-reveal] { opacity: 0; transform: translateY(1rem); transition: opacity var(--semantic-motion-duration) cubic-bezier(var(--semantic-motion-easing)), transform var(--semantic-motion-duration) cubic-bezier(var(--semantic-motion-easing)); }
[data-reveal].is-visible { opacity: 1; transform: translateY(0); }

@media (min-width: 48rem) {
  .padding-global { padding-right: 2.5rem; padding-left: 2.5rem; }
  .hero_component { grid-template-columns: minmax(0, 3fr) minmax(16rem, 1fr); gap: 4rem; padding-right: 2.5rem; padding-left: 2.5rem; }
  .hero_evidence-rail { margin-top: 0; }
  .service-index_item { grid-template-columns: 4rem minmax(0,1fr) auto; align-items: center; gap: 1.5rem; padding: 2rem 0; }
  .service-index_item .button { grid-column: auto; }
  .project-index_component { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .project-card_component:nth-child(3) { margin-top: 5rem; }
  .project-card_component:nth-child(4) { margin-top: -1rem; }
  .prompt-grid_component { grid-template-columns: repeat(3,1fr); }
  .prompt-grid_component article { padding: 1.5rem; border-right: 1px solid var(--primitive-color-ink); }
  .prompt-grid_component article:last-child { border-right: 0; }
  .principle-grid_component { grid-template-columns: repeat(3,1fr); }
  .form_split, .direct-contact_component { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1.25rem; }
  .service-route_blueprint { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .service-route_blueprint article { border-right: 1px solid var(--primitive-color-ink); border-bottom: 0; }
  .service-route_blueprint article:last-child { border-right: 0; }
  .service-route_identity-board { grid-template-columns: minmax(0,1.15fr) minmax(18rem,.85fr); align-items: end; }
  .service-route_search-path { grid-template-columns: repeat(4,minmax(0,1fr)); border-top: .35rem solid var(--semantic-color-action); border-left: 0; }
  .service-route_search-path li { display: block; min-height: 12rem; border-right: 1px solid var(--primitive-color-ink); border-bottom: 0; }
  .service-route_search-path li:last-child { border-right: 0; }
  .service-route_campaign-path { grid-template-columns: repeat(4,minmax(0,1fr)); gap: 0; align-items: start; }
  .service-route_campaign-path > div:nth-child(even) { margin-top: 3rem; transform: none; }
  .service-route_workflow-map > div { min-width: 28rem; }
  .footer_grid { grid-template-columns: 1.3fr repeat(3,1fr); }
  .review-index_component li { grid-template-columns: minmax(15rem,.6fr) 1fr; }
}

@media (min-width: 64rem) {
  .nav_inner { padding-right: 2.5rem; padding-left: 2.5rem; }
  .nav_link-list { display: flex; }
  .nav_action { display: inline-flex; }
  .menu_button, .mobile-nav_component { display: none !important; }
  .belief-grid_component, .scope-sheet_component, .contact-layout_component, .project-record_component, .service-detail_component, .support-page_component { grid-template-columns: minmax(0,1fr) minmax(24rem,1fr); gap: 5rem; }
  .cta_component { grid-template-columns: minmax(0,1fr) auto; }
  .process_component { grid-template-columns: minmax(0,.8fr) minmax(30rem,1.2fr); }
  .project-index_component { gap: 4rem; }
}

@media (max-width: 63.99rem) {
  .section_service-scope.is-identity-board .service-detail_component,
  .section_service-proof.is-search-path .project-record_component,
  .section_service-proof.is-workflow-map .project-record_component { grid-template-columns: 1fr; }
}

@media (max-width: 47.99rem) {
  .service-route_campaign-path > div:nth-child(even) { transform: none; }
  .service-route_workflow-map > div:nth-child(even) { margin-left: 0; }
  .section_project-record.is-commerce-build .project-record_component ol { grid-template-columns: 1fr; }
  .section_project-artifact.is-agency-brief .project-artifact_component,
  .section_project-artifact.is-commerce-build .project-artifact_component { width: 100%; margin-left: 0; transform: none; }
  .section_project-artifact.is-compliance-record .project-artifact_component { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: 0.01ms !important; animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; }
  [data-reveal] { opacity: 1; transform: none; }
}
