/* Scroll-driven video treatment adapted from the approved cable reference. */
html { background: var(--paper); }
body { background: transparent; }
.scroll-video { position: fixed; z-index: 0; inset: 0; overflow: hidden; background: #edf8fb; pointer-events: none; }
.scroll-video video { width: 100%; height: 100%; object-fit: cover; object-position: center; display: block; }
.scroll-video-wash { position: absolute; inset: 0; background: linear-gradient(112deg, rgba(247,249,252,.7), rgba(247,249,252,.18) 55%, rgba(247,249,252,.58)); }
.grain { z-index: 2; }
header, main, footer { position: relative; z-index: 3; }
.site-header { background: rgba(247,249,252,.82); backdrop-filter: blur(12px); border-color: rgba(16,24,39,.1); }
.site-header .brand { font-size: clamp(1.65rem, 2.2vw, 2.1rem); }
.site-header .brand-mark { width: 2rem; height: 2rem; font-size: 1rem; }
.section-hero { background: transparent; }
.hero-meta { justify-content: flex-start; }
.services { background: rgba(247,249,252,.94); backdrop-filter: blur(16px); }
.hero-layout { grid-template-columns: minmax(0, 3fr) minmax(260px, 2fr); align-items: center; }
.hero h1 { font-size: clamp(2.4rem, 4.6vw, 4.25rem); }
.hero-copy { max-width: 42rem; margin-top: 1.5rem; }
.hero-copy p { font-size: clamp(1.125rem, 1.45vw, 1.3rem); line-height: 1.45; }
.hero-visual { align-self: center; aspect-ratio: 3 / 2; min-height: 0; margin: 0; overflow: hidden; border: 1px solid rgba(16,24,39,.12); background: #eff8fc; }
.hero-visual img { width: 100%; height: auto; display: block; object-fit: contain; object-position: center; }
.hero-visual figcaption { padding: .65rem .85rem; background: rgba(247,249,252,.92); color: var(--muted); font: 700 .58rem var(--body); letter-spacing: .08em; text-transform: uppercase; }
.reduced-cable-art { display: none; }
.line-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(1rem, 2.2vw, 2rem); margin: 3.2rem 0 0; max-width: none; }
.line-grid article { min-height: 19rem; padding: clamp(1.4rem, 2.2vw, 2.2rem); border: 1px solid var(--line); background: rgba(255,255,255,.86); box-shadow: 0 12px 28px rgba(16,24,39,.06); }
.line-grid article:first-child { border-left: 1px solid var(--line); }
.line-grid h3 { font-size: clamp(1.75rem, 3vw, 3rem); margin: 2.2rem 0 .8rem; }
.line-grid p { color: var(--muted); font-size: .9rem; margin: 0; }
.service-art-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(1rem, 2.2vw, 2rem); margin-top: clamp(1rem, 2.2vw, 2rem); }
.service-art { margin: 0; overflow: hidden; border: 1px solid var(--line); background: #fff; }
.service-art img { width: 100%; aspect-ratio: 3 / 2; display: block; object-fit: contain; background: #f7f9fc; }
.service-art figcaption { padding: .7rem .85rem; color: var(--muted); font: 700 .58rem var(--body); letter-spacing: .08em; text-transform: uppercase; }
.automation-line, .automation-result { display: flex; flex-direction: column; }
.automation-diagram { display: grid; grid-template-columns: repeat(4, 1fr); gap: .45rem; padding: 0; margin: auto 0 .65rem; list-style: none; }
.automation-diagram li { position: relative; min-height: 4rem; display: grid; place-items: center; padding: .45rem; background: rgba(255,255,255,.72); border: 1px solid rgba(22,22,22,.15); color: var(--ink); font-size: .65rem; font-weight: 700; line-height: 1.2; text-align: center; }
.automation-diagram li:not(:last-child):after { content: "→"; position: absolute; z-index: 1; right: -.6rem; top: 50%; transform: translateY(-50%); width: 1rem; height: 1rem; display: grid; place-items: center; background: var(--yellow); color: var(--ink); font-size: .75rem; }
.visual-note, .request-kicker { display: block; color: var(--muted); font: 700 .58rem var(--body); letter-spacing: .08em; text-transform: uppercase; }
.sample-request { margin-top: auto; padding: .85rem; border: 1px solid rgba(22,22,22,.2); background: rgba(255,255,255,.78); }
.sample-request strong { display: block; margin-top: .35rem; font: 600 1rem var(--display); letter-spacing: -.03em; }
.sample-request dl { display: grid; grid-template-columns: 1fr 1.25fr; gap: .5rem; margin: .8rem 0 0; }
.sample-request dl div { padding-top: .45rem; border-top: 1px solid rgba(22,22,22,.13); }
.sample-request dt { color: var(--muted); font-size: .58rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.sample-request dd { margin: .15rem 0 0; font-size: .72rem; font-weight: 700; }
.sample-request dl div:last-child dd { display: inline-block; background: var(--yellow); padding: .15rem .28rem; }
.concept-illustration { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1.4fr); gap: 1rem; align-items: start; max-width: none; margin: 1.5rem 0 0; padding: clamp(1.2rem, 2vw, 2rem); border: 1px solid var(--line); background: rgba(255,255,255,.82); }
.concept-heading p { margin: .65rem 0 0; color: var(--muted); font-size: .78rem; line-height: 1.45; }
.before-after { display: grid; grid-template-columns: 1fr 1fr; gap: .55rem; }
.before-after div { min-height: 5.6rem; display: flex; flex-direction: column; justify-content: space-between; padding: .7rem; border: 1px solid rgba(22,22,22,.15); background: rgba(245,245,240,.75); }
.before-after div:last-child { background: rgba(34,211,238,.13); }
.before-after span, .concept-illustration small { color: var(--muted); font: 700 .58rem var(--body); letter-spacing: .08em; text-transform: uppercase; }
.before-after strong { font: 600 .9rem/1.15 var(--display); letter-spacing: -.03em; }
.scene-graphic { position: relative; display: block; height: 4.7rem; margin: .55rem 0 .7rem; overflow: hidden; border: 1px solid rgba(16,24,39,.13); background: #f1f8fc; }
.scene-graphic b { position: absolute; display: block; width: 2.3rem; height: 3.1rem; border: 1px solid rgba(16,24,39,.2); background: #fff; box-shadow: 4px 5px 0 rgba(16,24,39,.07); }
.scene-manual b:nth-child(1) { left: 14%; top: 1rem; transform: rotate(-8deg); }
.scene-manual b:nth-child(2) { left: 38%; top: .7rem; transform: rotate(4deg); }
.scene-manual b:nth-child(3) { left: 62%; top: 1.15rem; transform: rotate(-4deg); }
.scene-manual:after { content: ""; position: absolute; inset: 2.15rem 10% auto; height: 2px; background: repeating-linear-gradient(90deg, var(--yellow) 0 7px, transparent 7px 13px); transform: rotate(-5deg); }
.scene-organized { background: linear-gradient(135deg, #eff6ff, #fff); }
.scene-organized b { top: .85rem; width: 2.6rem; height: 2.8rem; border-color: rgba(99,102,241,.3); }
.scene-organized b:nth-child(1) { left: 16%; }
.scene-organized b:nth-child(2) { left: calc(50% - 1.3rem); background: #e0e7ff; }
.scene-organized b:nth-child(3) { right: 16%; background: rgba(34,211,238,.18); }
.scene-organized:after { content: ""; position: absolute; left: 24%; right: 24%; top: 2.2rem; height: 2px; background: var(--blue); }
.exception-note { grid-column: 2; margin: 0; padding: .55rem .65rem; border-left: 3px solid var(--yellow); background: rgba(245,245,240,.75); color: var(--ink); font-size: .74rem; line-height: 1.35; }
.concept-illustration small { grid-column: 2; margin-top: -.55rem; }
.process-illustration { display: grid; grid-template-columns: minmax(15rem,.7fr) minmax(0,1.7fr); gap: clamp(1rem,3vw,3rem); margin: 2rem 0 0; padding: clamp(1.25rem,3vw,3rem); border: 1px solid var(--line); border-left: 5px solid var(--yellow); background: linear-gradient(135deg, #eef8ff, #f7f9fc); }
.process-illustration figcaption h3 { max-width: 17rem; margin: .65rem 0 0; color: var(--ink); font-size: clamp(1.8rem,3vw,3.2rem); }
.flow-scene { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: .8rem; align-items: center; }
.flow-node { position: relative; min-height: 10rem; display: flex; flex-direction: column; justify-content: flex-end; padding: 1rem; border: 1px solid rgba(99,102,241,.22); background: rgba(255,255,255,.9); box-shadow: 0 10px 24px rgba(16,24,39,.06); }
.flow-node:not(:last-of-type):after { content: ""; position: absolute; z-index: 2; top: 3.05rem; right: -.8rem; width: .8rem; height: 2px; background: var(--blue); }
.flow-node:not(:last-of-type):before { content: ""; position: absolute; z-index: 2; top: 2.76rem; right: -.8rem; width: .55rem; height: .55rem; border-top: 2px solid var(--blue); border-right: 2px solid var(--blue); transform: rotate(45deg); }
.flow-symbol { width: 2.45rem; height: 2.45rem; display: grid; place-items: center; margin-bottom: auto; border-radius: 50%; background: var(--blue); color: #fff; font: 700 .65rem var(--body); letter-spacing: .06em; }
.flow-node:nth-child(2) .flow-symbol, .flow-node:nth-child(4) .flow-symbol { background: var(--yellow); color: var(--ink); }
.flow-node strong { font: 700 1.08rem var(--display); letter-spacing: -.04em; }
.flow-node small { margin-top: .25rem; color: var(--muted); font-size: .7rem; line-height: 1.25; }
.flow-branch { grid-column: 2 / -1; display: flex; align-items: center; gap: .75rem; padding: .8rem 1rem; border-left: 3px solid var(--amber); background: rgba(217,119,6,.1); color: var(--ink); }
.flow-branch span { color: var(--muted); font-size: .7rem; font-weight: 700; text-transform: uppercase; letter-spacing: .07em; }
.flow-branch strong { font: 600 .9rem var(--display); letter-spacing: -.02em; }
.benefits { position: relative; isolation: isolate; }
.benefits .section-intro, .benefits .benefit-list { background: rgba(247,249,252,.94); backdrop-filter: blur(14px); box-shadow: 0 10px 32px rgba(16,24,39,.06); }
.benefits .section-intro { padding: clamp(1.25rem, 2vw, 2rem); }
.benefits .benefit-list { padding: 0 clamp(1rem, 2vw, 1.6rem); }
.benefits .benefit-list p { color: var(--ink); }
@media (max-width: 900px) { .hero-layout { grid-template-columns: 1fr; } .hero-visual { min-height: 10rem; } }
@media (max-width: 760px) { .process-illustration { grid-template-columns: 1fr; } .process-illustration figcaption h3 { max-width: 24rem; } .flow-scene { grid-template-columns: 1fr 1fr; } .flow-node:not(:last-of-type):after, .flow-node:not(:last-of-type):before { display: none; } .flow-branch { grid-column: 1 / -1; flex-direction: column; align-items: flex-start; } .service-art-grid { grid-template-columns: 1fr; } }
@media (max-width: 560px) { .site-header .brand { font-size: 1.58rem; } .hero h1 { font-size: clamp(2.4rem, 11vw, 2.75rem); } .line-grid { grid-template-columns: 1fr; margin-top: 2rem; gap: 1rem; } .line-grid article { min-height: 0; border-left: 1px solid var(--line); } .line-grid h3 { margin-top: 1.2rem; } .automation-diagram { grid-template-columns: 1fr 1fr; margin-top: 1.2rem; } .automation-diagram li:not(:last-child):after { display: none; } .concept-illustration { grid-template-columns: 1fr; padding: 1rem; } .exception-note, .concept-illustration small { grid-column: auto; } .flow-node { min-height: 8.2rem; padding: .75rem; } }
@media (prefers-reduced-motion: reduce) { .scroll-video { display: none; } .reduced-cable-art { display: block; position: fixed; z-index: 0; } }

/* Compact, evidence-led composition adapted from the approved review sketch. */
.section-hero { min-height: 0; padding-top: clamp(7rem, 10vw, 9rem); padding-bottom: clamp(3.5rem, 6vw, 6rem); }
.hero-meta { align-self: flex-start; padding: .42rem .65rem; border: 1px solid rgba(99,102,241,.2); background: rgba(238,242,247,.86); }
.hero-meta b { color: var(--yellow); margin: 0 .35rem; }
.hero-layout { grid-template-columns: minmax(0, 1fr); max-width: 72rem; margin: 2.5rem auto 0; gap: clamp(2rem, 4vw, 3.5rem); }
.hero-layout > div { max-width: 58rem; }
.hero-copy { max-width: 39rem; }
.hero-visual { width: 100%; max-width: 72rem; margin: 0; box-shadow: 0 16px 38px rgba(16,24,39,.08); }
.hero-visual figcaption { padding: .8rem 1rem; font-size: .67rem; }
.flow-mobile-steps { display: none; }
@media (min-width: 561px) { .hero-layout { gap: 1.25rem; } .hero-layout > div { display: contents; } .hero-layout .overline { order: 1; margin-bottom: .2rem; } .hero-layout h1 { order: 2; margin-top: 0; } .hero-layout .hero-visual { order: 3; margin-top: .4rem; } .hero-layout .hero-copy { order: 4; max-width: 46rem; margin-top: 1rem; } }
.services .lead { max-width: 45rem; margin-left: 0; }
.line-grid { margin-top: 2.2rem; }
.line-grid article { min-height: 14rem; }
.line-grid article > .automation-diagram, .line-grid article > .sample-request, .line-grid article > .visual-note { display: none; }
.line-grid article > p { max-width: 32rem; }
.text-link { display: inline-flex; align-items: center; gap: .5rem; width: fit-content; margin-top: auto; padding-top: 1.25rem; color: var(--ink); font: 700 .72rem var(--body); letter-spacing: .07em; text-decoration: none; text-transform: uppercase; }
.text-link span { color: var(--blue); font-size: 1.05rem; line-height: .7; }
.service-art-grid { margin-top: 1.25rem; }
.concept-illustration, .process-illustration { display: none; }
.service-grid { margin-top: 2rem; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.service-card { min-height: 15rem; }
.portfolio .section-intro h2 { max-width: 43rem; }
.portfolio-cta { display: flex; justify-content: space-between; gap: 2rem; align-items: center; margin-top: clamp(2.2rem, 5vw, 4rem); padding: clamp(1.3rem, 3vw, 2.2rem); background: var(--ink); color: #fff; border-radius: .35rem; }
.portfolio-cta h3 { max-width: 36rem; margin: 0; color: #fff; font-size: clamp(1.5rem, 3vw, 2.6rem); }
.portfolio-cta p { margin: .65rem 0 0; color: #c5d0df; }
.button-cyan { flex: none; background: var(--yellow); color: var(--ink); }
@media (max-width: 900px) { .section-hero { min-height: auto; } .hero-layout { margin: 3rem 0; } .service-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .portfolio-cta { align-items: flex-start; flex-direction: column; } }
@media (max-width: 560px) { .hero-meta { max-width: 100%; } .hero-visual { display: none; } .flow-mobile-steps { display: grid; grid-template-columns: 1fr 1fr; gap: .65rem; padding: 0; margin: 2rem 0 0; list-style: none; } .flow-mobile-steps li { min-height: 7.5rem; display: flex; flex-direction: column; justify-content: space-between; padding: .85rem; border: 1px solid rgba(99,102,241,.24); background: rgba(255,255,255,.86); } .flow-mobile-steps b { color: var(--blue); font: 700 .68rem var(--body); letter-spacing: .08em; } .flow-mobile-steps span { font: 700 1rem/1.08 var(--display); letter-spacing: -.035em; } .hero-foot { display: none; } .line-grid article { min-height: 13rem; } .service-grid { grid-template-columns: 1fr; } .portfolio-cta { padding: 1.2rem; } .portfolio-cta .button { width: 100%; } .video-card:last-child { grid-column: 1 / -1; max-width: min(100%, 24rem); } }

/* Capability stories use fictitious inputs to show adaptable service logic. */
.capability-showcase { margin-top: 1.25rem; padding: clamp(1.25rem, 3vw, 2.75rem); border: 1px solid var(--line); background: linear-gradient(135deg, rgba(238,248,255,.96), rgba(255,255,255,.92)); scroll-margin-top: 6rem; }
.capability-heading { display: grid; grid-template-columns: minmax(9rem,.55fr) minmax(0,1.45fr); gap: 1rem 2rem; align-items: start; }
.capability-heading h3, .audiovisual-copy h3 { margin: 0; font-size: clamp(1.85rem, 3.2vw, 3.5rem); }
.capability-heading > p:last-child { grid-column: 2; max-width: 42rem; margin: -.35rem 0 0; color: var(--muted); font-size: .9rem; }
.workflow-cases { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 1rem; margin-top: clamp(1.4rem, 3vw, 2.5rem); }
.workflow-case { min-height: 24rem; display: flex; flex-direction: column; padding: clamp(1rem, 2vw, 1.5rem); border: 1px solid rgba(99,102,241,.22); background: rgba(255,255,255,.9); box-shadow: 0 10px 24px rgba(16,24,39,.05); }
.workflow-case:nth-child(2) { background: rgba(245,251,255,.96); }
.case-number { color: var(--blue); font: 700 .65rem var(--body); letter-spacing: .1em; }
.workflow-case h4 { max-width: 22rem; margin: .65rem 0 .6rem; font: 700 clamp(1.3rem, 2vw, 2rem) var(--display); letter-spacing: -.045em; line-height: 1; }
.workflow-case > p { max-width: 33rem; margin: 0; color: var(--muted); font-size: .84rem; line-height: 1.45; }
.workflow-steps { display: grid; grid-template-columns: repeat(5, minmax(0,1fr)); gap: .38rem; padding: 0; margin: 1.25rem 0 .65rem; list-style: none; }
.workflow-steps li { position: relative; min-height: 6.15rem; display: grid; place-items: center; padding: .4rem; border: 1px solid rgba(16,24,39,.13); background: #fff; color: var(--ink); font-size: .64rem; font-weight: 700; line-height: 1.16; text-align: center; }
.workflow-steps li:not(:last-child):after { content: "→"; position: absolute; z-index: 1; right: -.58rem; top: 50%; display: grid; place-items: center; width: 1.1rem; height: 1.1rem; transform: translateY(-50%); border-radius: 50%; background: var(--yellow); color: var(--ink); font-size: .72rem; }
.exception-branch { display: block; padding: .5rem .65rem; border-left: 3px solid var(--amber); background: rgba(217,119,6,.09); color: var(--ink); font: 700 .66rem/1.3 var(--body); }
.workflow-status { grid-column: 1 / -1; min-height: 13rem; display: grid; grid-template-columns: minmax(13rem,.75fr) minmax(0,1.25fr); column-gap: 2rem; }
.workflow-status .case-number, .workflow-status h4, .workflow-status > p { grid-column: 1; }
.workflow-status .status-list { grid-column: 2; grid-row: 1 / span 3; align-self: center; }
.status-list { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: .65rem; padding: 0; margin: 0; list-style: none; }
.status-list li { min-height: 5rem; display: flex; flex-direction: column; justify-content: flex-end; gap: .6rem; padding: .75rem; border: 1px solid rgba(16,24,39,.13); background: #fff; font: 700 .78rem/1.15 var(--display); letter-spacing: -.025em; }
.status-list i { width: .7rem; height: .7rem; border-radius: 50%; background: var(--blue); box-shadow: 0 0 0 5px rgba(99,102,241,.1); }
.status-list li:nth-child(2) i, .status-list li:nth-child(4) i { background: var(--yellow); box-shadow: 0 0 0 5px rgba(34,211,238,.14); }
.status-list li:nth-child(3) i { background: var(--amber); box-shadow: 0 0 0 5px rgba(217,119,6,.12); }
.workflow-status > small { grid-column: 1; margin-top: .8rem; color: var(--muted); font-size: .68rem; }
.audiovisual-story { display: grid; grid-template-columns: minmax(14rem,.78fr) minmax(0,1.22fr); gap: clamp(1.2rem, 3vw, 3.5rem); align-items: center; margin-top: 1.25rem; padding: clamp(1.25rem, 3vw, 2.75rem); border: 1px solid rgba(99,102,241,.2); background: rgba(247,249,252,.9); }
.audiovisual-copy > p:last-child { margin: 1rem 0 0; color: var(--muted); font-size: .86rem; line-height: 1.48; }
.ad-sequence { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: clamp(.55rem, 1.2vw, 1rem); align-items: start; margin: 0; }
.ad-shot { min-width: 0; margin: 0; overflow: hidden; border: 1px solid var(--line); background: #edf2f7; }
.ad-shot img { display: block; width: 100%; height: clamp(15rem, 28vw, 26rem); aspect-ratio: 9 / 16; object-fit: contain; background: #fff; }
.ad-shot figcaption { display: flex; gap: .5rem; align-items: baseline; padding: .85rem; color: var(--ink); background: #fff; font: 700 .84rem var(--body); }
.ad-shot b { color: var(--blue); font-size: .62rem; letter-spacing: .08em; }
@media (max-width: 900px) { .capability-heading, .audiovisual-story { grid-template-columns: 1fr; } .capability-heading > p:last-child { grid-column: auto; margin-top: 0; } .workflow-status { grid-template-columns: 1fr; } .workflow-status .case-number, .workflow-status h4, .workflow-status > p, .workflow-status .status-list, .workflow-status > small { grid-column: auto; grid-row: auto; } .workflow-status .status-list { margin-top: 1.2rem; } }
@media (max-width: 1100px) and (min-width: 901px) { .audiovisual-story { grid-template-columns: 1fr; } }
@media (max-width: 620px) { .workflow-cases { grid-template-columns: 1fr; } .workflow-case { min-height: 0; } .workflow-status { grid-column: auto; } .workflow-steps { grid-template-columns: 1fr 1fr; margin-top: 1.4rem; } .workflow-steps li { min-height: 4.6rem; font-size: .72rem; } .workflow-steps li:not(:last-child):after { display: none; } .status-list { grid-template-columns: 1fr 1fr; } .status-list li { min-height: 4.3rem; } .ad-sequence { gap: .45rem; } .ad-shot figcaption { padding: .5rem; font-size: .58rem; flex-direction: column; gap: .18rem; } }
@media (max-width: 620px) { .audiovisual-story .ad-sequence { grid-template-columns: 1fr; gap: .65rem; } .audiovisual-story .ad-shot { display: grid; grid-template-columns: 6.5rem 1fr; min-height: 8.5rem; } .audiovisual-story .ad-shot img { height: 8.5rem; aspect-ratio: 9 / 16; object-fit: contain; background: #fff; } .audiovisual-story .ad-shot figcaption { align-self: center; padding: 1rem; font-size: .95rem; flex-direction: row; gap: .55rem; } .audiovisual-story .ad-shot b { font-size: .7rem; } }

/* Contact demo and approved GSD Flow labs mark. */
.site-header { border-bottom-color: rgba(16,24,39,.08); background: rgba(251,250,246,.94); backdrop-filter: blur(12px); }
.brand { flex: none; font-size: 0; letter-spacing: 0; }
.brand img { display: block; width: clamp(9rem, 16vw, 13rem); height: auto; }
footer { border-top: 1px solid var(--line); background: #f7f9fc; color: var(--muted); }
footer .brand { color: var(--ink); }
footer .brand img { width: clamp(8.6rem, 14vw, 11.25rem); }
footer a:last-child { color: var(--ink); }
.contact { align-items: start; }
.demo-form { max-width: 42rem; }
.field-legend { margin: 0; color: var(--ink); font-size: .72rem; font-weight: 700; letter-spacing: .04em; }
.field-legend > span:first-child, .demo-form label > span[aria-hidden="true"] { color: var(--blue); }
.field-optional { margin-left: .3rem; color: var(--muted); font-size: .62rem; font-weight: 600; letter-spacing: .04em; text-transform: none; }
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 1rem; }
.demo-form label { min-width: 0; display: block; color: var(--ink); }
.demo-form input, .demo-form select, .demo-form textarea { box-sizing: border-box; min-height: 2.8rem; border: 1px solid rgba(16,24,39,.28); border-radius: .2rem; background: rgba(255,255,255,.78); }
.demo-form select { display: block; width: 100%; margin-top: .4rem; padding: .7rem .65rem; color: var(--ink); font: 400 1rem var(--body); }
.demo-form textarea { min-height: 8.4rem; padding: .75rem; }
.phone-fields { display: grid; grid-template-columns: minmax(5.8rem,.55fr) minmax(0,1fr); gap: .7rem; min-width: 0; }
.field-full { grid-column: 1 / -1; }
.form-errors { display: none; margin: 0; padding: .75rem .85rem; border-left: 3px solid var(--amber); background: rgba(255,255,255,.72); color: var(--ink); font-size: .82rem; line-height: 1.4; }
.form-errors:not(:empty) { display: block; }
.demo-form [aria-invalid="true"] { border-color: #9a3412; box-shadow: 0 0 0 2px rgba(154,52,18,.16); }
.contact .button-yellow { background: var(--ink); color: #fff; }
.contact .button-yellow:hover { background: #24324a; }
@media (max-width: 700px) { .form-grid { grid-template-columns: 1fr; } .field-full { grid-column: auto; } }
@media (max-width: 420px) { .brand img { width: 8.6rem; } .phone-fields { grid-template-columns: 1fr; } }

/* Two-service positioning and internal navigation destinations. */
.site-header nav { align-items: center; }
.nav-services { position: relative; }
.nav-services summary { color: var(--ink); cursor: pointer; font-size: .76rem; font-weight: 600; list-style: none; }
.nav-services summary::-webkit-details-marker { display: none; }
.nav-services summary::after { content: "⌄"; margin-left: .25rem; color: var(--blue); }
.nav-services > div { position: absolute; top: calc(100% + .7rem); left: -.7rem; display: none; width: 13rem; padding: .55rem; border: 1px solid var(--line); background: rgba(251,250,246,.98); box-shadow: 0 12px 30px rgba(16,24,39,.12); }
.nav-services[open] > div { display: grid; gap: .15rem; }
.site-header .nav-services > div a { padding: .55rem; font-size: .72rem; }
.site-header .nav-services > div a:hover, .site-header .nav-services > div a:focus-visible { background: rgba(34,211,238,.14); }
.service-points { display: grid; gap: .45rem; margin: 1rem 0 0; padding: 0; color: var(--muted); font-size: .78rem; line-height: 1.35; list-style: none; }
.service-points li { position: relative; padding-left: .9rem; }
.service-points li::before { content: ""; position: absolute; left: 0; top: .38rem; width: .36rem; height: .36rem; border-radius: 50%; background: var(--blue); }
.audiovisual-copy > p:not(.eyebrow) { margin: 1rem 0 0; color: var(--muted); font-size: .86rem; line-height: 1.48; }
.production-steps { display: grid; grid-template-columns: 1fr 1fr; gap: .45rem; margin: 1rem 0 0; padding: 0; list-style: none; }
.production-steps li { min-height: 2.9rem; display: flex; align-items: center; padding: .55rem; border: 1px solid rgba(99,102,241,.22); background: rgba(255,255,255,.8); color: var(--ink); font: 700 .68rem/1.2 var(--body); }
.audiovisual-copy .text-link { margin-top: 1rem; padding-top: 0; }
.audiovisual-copy .sample-video-cta { width: fit-content; margin-top: 1rem; }
.audiovisual-copy small { display: block; margin-top: .75rem; color: var(--muted); font-size: .67rem; line-height: 1.35; }
.project-split { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1rem; margin: 2rem 0; }
.project-split article { min-height: 15rem; display: flex; flex-direction: column; padding: clamp(1.15rem,2.5vw,2rem); border: 1px solid var(--line); background: rgba(255,255,255,.78); }
.project-split article:last-child { background: rgba(238,248,255,.82); }
.project-split h3 { margin: .8rem 0; font-size: clamp(1.55rem,2.5vw,2.35rem); }
.project-split p { max-width: 30rem; margin: 0; color: var(--muted); font-size: .9rem; line-height: 1.45; }
.project-split .text-link { margin-top: auto; }
.about { display: grid; grid-template-columns: minmax(0,1fr) minmax(16rem,.7fr); gap: clamp(2rem,6vw,7rem); align-items: start; background: rgba(247,249,252,.92); }
.about .section-intro { display: block; }
.about .section-intro h2 { margin-top: 1rem; }
.about-copy { padding-top: 2.1rem; }
.about-copy p { margin: 0 0 1rem; color: var(--muted); font-size: 1rem; line-height: 1.55; }
.about-copy strong { color: var(--ink); }
@media (max-width: 900px) { .nav-services > div { position: static; width: auto; margin-top: .45rem; box-shadow: none; } .site-header .nav-services > div a { padding-left: .7rem; } .project-split, .about { grid-template-columns: 1fr; } .about-copy { padding-top: 0; } }
@media (max-width: 620px) { .production-steps { grid-template-columns: 1fr; } .project-split { margin: 1.25rem 0; } }

/* Conditional, local-only service briefings. */
.video-sample-fields, .automation-brief-fields { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1rem; padding: 1rem; border: 1px solid rgba(99,102,241,.28); background: rgba(255,255,255,.62); }
.video-sample-fields[hidden], .automation-brief-fields[hidden] { display: none; }
.video-sample-fields .sample-fields-title, .video-sample-fields .sample-fields-note, .automation-brief-fields .sample-fields-title, .automation-brief-fields .sample-fields-note { grid-column: 1 / -1; margin: 0; }
.brief-field-full { grid-column: 1 / -1; }
.sample-fields-title { color: var(--ink); font: 700 1.05rem var(--display); letter-spacing: -.025em; }
.sample-fields-note { padding-left: .7rem; border-left: 3px solid var(--yellow); color: var(--muted); font-size: .78rem; line-height: 1.4; }
.honeypot { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }
@media (max-width: 700px) { .video-sample-fields, .automation-brief-fields { grid-template-columns: 1fr; } .brief-field-full { grid-column: auto; } }