/* Reference snapshot: Homepage Style Lab/public/refinements.css. Canonical tokens follow in design-tokens.css. */
/* Shared type and motion refinements for the isolated homepage. */
:root { --display-font:Arial,Helvetica,sans-serif; --body-font:Arial,Helvetica,sans-serif; --display-weight:700; --display-spacing:-.055em; --display-leading:1.02; }
body { font-family:var(--body-font); }
h1,h2,h3 { font-family:var(--display-font); }
.hero h1 { font-weight:var(--display-weight);letter-spacing:var(--display-spacing);line-height:.95;font-size:clamp(48px,7.2vw,112px); }
.heading-row h2,.pricing-intro h2,.about-story h2,.final-cta h2 { font-weight:var(--display-weight);letter-spacing:-.045em;line-height:var(--display-leading);text-wrap:balance; }
.hero-description,.about-copy p,.package-description { font-family:var(--body-font);text-wrap:pretty; }
.hero-description { max-width:36ch;line-height:1.65; }
.about-copy p { max-width:58ch; }
.project-image { overflow:hidden; }
.project-image img { transition:none; }
.native-process { position:absolute;left:0;top:0;transform-origin:top left;pointer-events:none; }
@media(max-width:600px) { .hero h1 { font-size:clamp(48px,13.8vw,72px);letter-spacing:-.06em; }.hero-description { line-height:1.6; } }
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } }

/* Reference-led typography and drafting details. */
:root { --display-spacing:-.065em;--display-weight:700;--draft-ink:rgba(167,173,181,.15); }
.hero { position:relative;isolation:isolate;overflow:hidden; }
.hero-inner { position:relative;z-index:1; }
.hero h1 { font:700 clamp(65px,8.5vw,132px)/.96 Arial,Helvetica,sans-serif;letter-spacing:-.065em;text-transform:none;max-width:9ch; }
h1 em,h2 em,.heading-row h2 em,.pricing-intro h2 em,.about-story h2 em,.final-cta h2 em { color:var(--blue);font-weight:400;font-style:italic;letter-spacing:-.065em; }
.hero h1 em { display:block;white-space:nowrap; }
.heading-row h2,.pricing-intro h2,.about-story h2,.final-cta h2 { font-family:Arial,Helvetica,sans-serif;font-weight:700; }
.heading-row h2 { font-size:clamp(42px,6.4vw,88px);text-transform:none; }
.eyebrow { font-family:Consolas,'Courier New',monospace;letter-spacing:.17em; }
.hero-meta .eyebrow,.hero-meta { font-family:Arial,Helvetica,sans-serif;letter-spacing:.2em; }
.drafted-section { position:relative;isolation:isolate;overflow:clip; }
.drafted-section>.wrap,.drafted-section>.about-strip,.drafted-section>.cta-row,.drafted-section>.cta-bottom,.drafted-section>.eyebrow { position:relative;z-index:1; }
.drafting-layer { position:absolute;inset:0;z-index:-1;pointer-events:none;overflow:hidden; }
.hero>.drafting-layer { z-index:0; }
.draft-lines { position:absolute;inset:-5%;width:110%;height:110%;fill:none;stroke:var(--draft-ink);stroke-width:.65;vector-effect:non-scaling-stroke; }
.draft-blue { stroke:#2478d855; }
.draft-cross { position:absolute;width:13px;height:13px;opacity:.5; }
.draft-cross:before,.draft-cross:after { content:'';position:absolute;top:6px;left:0;width:13px;height:1px;background:#5c93c9;transform:rotate(45deg); }.draft-cross:after { transform:rotate(-45deg); }
.cross-one { left:42%;top:18%; }.cross-two { right:8%;top:69%; }.cross-three { left:14%;bottom:15%; }
.draft-corner { position:absolute;width:28px;height:28px;border-left:1px solid #a7adb566;border-top:1px solid #a7adb566; }.corner-one { top:28%;left:4%; }.corner-two { bottom:12%;right:5%;transform:rotate(180deg); }
.light-section { --draft-ink:rgba(20,23,26,.08); }
.section-ghost { position:absolute;top:32px;right:5%;z-index:-1;font:700 clamp(160px,28vw,420px)/.8 Arial,Helvetica,sans-serif;letter-spacing:-.095em;color:currentColor;opacity:.045;pointer-events:none;user-select:none; }
.pricing-catalogue>.section-ghost { top:65px; }
.about-band>.section-ghost { top:25px;color:var(--muted);opacity:.08; }
[data-outline] { position:relative; }
.type-solid { display:block; }
.type-outline { position:absolute;inset:0;pointer-events:none;color:transparent!important;-webkit-text-stroke:.8px var(--outline-ink,var(--paper));mask-image:radial-gradient(circle 65px at var(--reveal-x,-200px) var(--reveal-y,-200px),#000 96%,transparent 100%); }
.type-outline em { color:transparent!important;-webkit-text-stroke:.8px var(--blue); }
.light-section [data-outline] { --outline-ink:var(--ink); }
.outline-revealing>.type-solid { mask-image:radial-gradient(circle 65px at var(--reveal-x,-200px) var(--reveal-y,-200px),transparent 96%,#000 100%); }
.cursor-arrow,.cursor-blob { position:fixed;top:0;left:0;pointer-events:none;z-index:2000;opacity:0; }
.cursor-arrow { width:19px;height:23px;filter:drop-shadow(0 1px 2px #0005); }
.cursor-blob { width:130px;height:130px;margin:-65px;border:1px solid #7baadd65;border-radius:45% 55% 53% 47%;background:radial-gradient(circle,#2478d808,transparent 70%);mix-blend-mode:difference; }
@media(hover:hover) and (pointer:fine) { .custom-pointer,.custom-pointer a,.custom-pointer button { cursor:none; }.custom-pointer .cursor-arrow,.custom-pointer .cursor-blob { opacity:1; } }
@media(max-width:700px) { .hero h1 { font-size:clamp(52px,14.8vw,94px);max-width:none; }.section-ghost { font-size:210px;top:24px;opacity:.035; }.draft-lines { opacity:.55; }.hero h1 em { white-space:normal; }.heading-row h2 { font-size:clamp(40px,10vw,64px); } }
@media(prefers-reduced-motion:reduce) { .cursor-blob { display:none; }.outline-revealing>.type-solid { mask-image:none; }.type-outline { display:none; } }
@font-face { font-family:'Geist Mono';src:url('/assets/fonts/design/geist-mono.woff2') format('woff2');font-style:normal;font-weight:100 900;font-display:swap; }
:root { --technical-font:'Geist Mono',Consolas,monospace; }
.eyebrow,.hero-index,.about-location,.pricing-tabs,.package-price small,.price-billing,.portfolio-note { font-family:var(--technical-font); }
.heading-row h2 { font-family:var(--technical-font);font-weight:900;letter-spacing:-.065em; }
.heading-row h2 em { font-family:Arial,Helvetica,sans-serif;font-weight:400; }
.about-principles h3,.project-caption h3 { font-family:var(--technical-font);font-weight:800;letter-spacing:-.05em; }
.pricing-package h3 { font-family:var(--technical-font);font-weight:800;letter-spacing:-.065em; }

.type-outline { opacity:0; }.outline-revealing>.type-outline { opacity:1; }
/* All display typography uses the same uppercase Geist family. */
@font-face { font-family:'Geist Mono';src:url('/assets/fonts/design/geist-mono-italic.woff2') format('woff2');font-style:italic;font-weight:100 900;font-display:swap; }
:root { --display-font:'Geist Mono',Consolas,monospace; }
h1,h2,h3,.hero h1,.heading-row h2,.pricing-intro h2,.about-story h2,.final-cta h2,.pricing-package h3 { font-family:var(--display-font);font-weight:900;text-transform:uppercase;letter-spacing:-.065em; }
h1 em,h2 em,.hero h1 em,.heading-row h2 em,.pricing-intro h2 em,.about-story h2 em,.final-cta h2 em { font-family:var(--display-font);font-weight:400;font-style:italic; }
.hero h1 { font-size:clamp(58px,7vw,104px);max-width:11ch; }
@media(max-width:700px) { .hero h1 { font-size:clamp(35px,10vw,70px);max-width:none; }.hero h1 em { display:block;white-space:nowrap; } }
/* Editorial contrast: initial-cap Arial italics against uppercase technical headings. */
h1 em,h2 em,.hero h1 em,.heading-row h2 em,.pricing-intro h2 em,.about-story h2 em,.final-cta h2 em { font-family:Arial,Helvetica,sans-serif;font-weight:700;font-style:italic;text-transform:none;letter-spacing:-.055em; }


/* Latest type trial: regular Geist Mono, natural capitalization. */
h1,h2,h3,.hero h1,.heading-row h2,.pricing-intro h2,.about-story h2,.final-cta h2,.pricing-package h3,.about-principles h3,.project-caption h3 { font-family:var(--display-font);font-weight:400;text-transform:none; }
h1 em,h2 em,.hero h1 em,.heading-row h2 em,.pricing-intro h2 em,.about-story h2 em,.final-cta h2 em { font-family:var(--display-font);font-weight:400;font-style:normal;text-transform:none; }
/* Current trial: regular Geist Mono italic, natural capitalization. */
h1,h2,h3,.hero h1,.heading-row h2,.pricing-intro h2,.about-story h2,.final-cta h2,.pricing-package h3,.about-principles h3,.project-caption h3,h1 em,h2 em,.hero h1 em,.heading-row h2 em,.pricing-intro h2 em,.about-story h2 em,.final-cta h2 em { font-family:var(--display-font);font-weight:400;font-style:italic;text-transform:none; }
/* Restore the approved bold headings; only blue emphasis is being trialled. */
h1,h2,h3,.hero h1,.heading-row h2,.pricing-intro h2,.about-story h2,.final-cta h2,.pricing-package h3,.about-principles h3,.project-caption h3 { font-family:var(--display-font);font-weight:900;font-style:normal;text-transform:uppercase; }
h1 em,h2 em,.hero h1 em,.heading-row h2 em,.pricing-intro h2 em,.about-story h2 em,.final-cta h2 em { font-family:var(--display-font);font-weight:700;font-style:italic;text-transform:none;font-size:.88em; }
/* Blue emphasis: proportional Geist Bold Italic, not Geist Mono. */
@font-face { font-family:'Geist';src:url('/assets/fonts/design/geist-italic.woff2') format('woff2');font-weight:100 900;font-style:italic;font-display:swap; }
h1 em,h2 em,.hero h1 em,.heading-row h2 em,.pricing-intro h2 em,.about-story h2 em,.final-cta h2 em { font-family:'Geist',Arial,sans-serif;font-weight:700;font-style:italic;text-transform:none;font-size:.88em; }
/* Initial-cap trial; preserve current weights and blue italic treatment. */
h1,h2,h3,.hero h1,.heading-row h2,.pricing-intro h2,.about-story h2,.final-cta h2,.pricing-package h3,.about-principles h3,.project-caption h3 { text-transform:none; }

/* Restore uppercase surrounding headings; blue emphasis stays unchanged. */
h1,h2,h3,.hero h1,.heading-row h2,.pricing-intro h2,.about-story h2,.final-cta h2,.pricing-package h3,.about-principles h3,.project-caption h3 { text-transform:uppercase; }
/* Quiet hero detailing: retain the base grid, remove the added drafting frame. */
.hero .draft-lines,.hero .draft-corner { display:none; }
.draft-cross { opacity:.23; }
.cross-four { left:66%;top:42%; }.cross-five { left:24%;top:72%; }.cross-six { right:16%;top:12%; }
.grid-reinforcement { display:none;position:absolute;width:25px;height:25px;border-top:1px solid #a7adb53d;border-left:1px solid #a7adb53d; }
.hero .grid-reinforcement { display:block; }
.grid-one { left:48px;top:240px; }.grid-two { right:96px;top:144px;transform:rotate(90deg); }.grid-three { left:calc(50% - 24px);bottom:144px;transform:rotate(180deg); }.grid-four { right:48px;bottom:48px;transform:rotate(180deg); }
@media(max-width:700px) { .grid-one { left:48px;top:192px; }.grid-two { right:48px;top:384px; }.grid-three { display:none!important; } }
/* Grid intersection markers: short plus signs, not corner brackets. */
.grid-reinforcement { width:9px;height:9px;border:0;transform:none!important; }
.grid-reinforcement::before,.grid-reinforcement::after { content:'';position:absolute;background:#a7adb53d; }
.grid-reinforcement::before { width:9px;height:1px;left:0;top:4px; }
.grid-reinforcement::after { width:1px;height:9px;left:4px;top:0; }
/* Stationary + marks repeat every four cells of the existing 48px grid. */
.hero,.avara-process,.pricing-extras-surface,.final-cta {
 background-image:url('/assets/images/grid-intersections.svg'),var(--construction-grid);
 background-size:192px 192px,48px 48px,48px 48px;
 background-position:0 0,0 0,0 0;
 background-repeat:repeat;
}
.hero .grid-reinforcement { display:none; }

/* Opaque section surfaces prevent the body grid from showing through twice. */
.hero,.avara-process,.pricing-extras-surface,.final-cta { background-color:var(--bg); }
/* The outline reveal follows the trailing blob's breathing shape. */
.type-outline { mask-image:radial-gradient(ellipse var(--reveal-rx,65px) var(--reveal-ry,65px) at var(--reveal-x,-200px) var(--reveal-y,-200px),#000 96%,transparent 100%); }
.outline-revealing>.type-solid { mask-image:radial-gradient(ellipse var(--reveal-rx,65px) var(--reveal-ry,65px) at var(--reveal-x,-200px) var(--reveal-y,-200px),transparent 96%,#000 100%); }

/* Button labels share the outline lens without changing the blob or hit area. */
a.button { position:relative; }
a.button>.type-solid { display:flex;align-items:center;justify-content:space-between;gap:14px;width:100%; }
a.button>.type-outline { display:flex;align-items:center;justify-content:space-between;gap:14px;inset:0;padding:inherit;border:0;-webkit-text-stroke:.55px currentColor;color:inherit!important;-webkit-text-fill-color:transparent; }
a.button>.type-outline svg { fill:currentColor; }
/* Smaller blob; button fills and reading lens stay clipped to its footprint. */
.cursor-blob { width:96px;height:96px;margin:-48px; }
a.button { --button-rest:var(--paper);--button-fill:var(--paper);--button-fill-text:var(--bg); }
.light-section a.button { --button-rest:var(--ink);--button-fill:var(--ink);--button-fill-text:var(--paper); }
.custom-pointer a.button,.custom-pointer a.button:hover { background:transparent;color:var(--button-rest); }
.button-solid { display:flex;align-items:center;justify-content:space-between;gap:14px;width:100%; }
.button-fill { position:absolute;inset:0;display:flex;align-items:center;justify-content:space-between;gap:14px;padding:inherit;color:var(--button-fill-text);background:var(--button-fill);pointer-events:none;opacity:0;mask-image:radial-gradient(ellipse var(--reveal-rx,48px) var(--reveal-ry,48px) at var(--reveal-x,-200px) var(--reveal-y,-200px),#000 96%,transparent 100%); }
.blob-fill-active>.button-fill { opacity:1; }
.body-lens-active,.hero-description,.about-copy p,.package-description,.cta-bottom p { position:relative; }
.lens-solid { display:block; }
.lens-copy { position:absolute;inset:0;display:block;pointer-events:none;opacity:0;transform:scale(1.055);transform-origin:var(--reveal-x,50%) var(--reveal-y,50%);mask-image:radial-gradient(ellipse var(--reveal-rx,48px) var(--reveal-ry,48px) at var(--reveal-x,-200px) var(--reveal-y,-200px),#000 85%,transparent 100%); }
.body-lens-active>.lens-copy { opacity:1; }
.body-lens-active>.lens-solid { mask-image:radial-gradient(ellipse var(--reveal-rx,48px) var(--reveal-ry,48px) at var(--reveal-x,-200px) var(--reveal-y,-200px),transparent 85%,#000 100%); }
/* Hero returns to the supplied Arial reference and two-line composition. */
.hero h1 { font-family:Arial,Helvetica,sans-serif;font-weight:700;font-style:normal;text-transform:none;font-size:clamp(48px,6.2vw,96px);line-height:1.02;letter-spacing:-.065em;max-width:none; }
.hero h1 em { display:inline!important;font-family:Arial,Helvetica,sans-serif;font-weight:400;font-style:italic;text-transform:none;font-size:1em;letter-spacing:-.065em; }
.hero-title-line { white-space:nowrap; }
@media(max-width:700px) { .hero h1 { font-size:clamp(33px,10vw,65px); }.hero-copy { max-width:100%; } }
.text-response-word { display:inline-block;position:relative; }
.text-response-word::after { content:'';position:absolute;left:0;right:0;bottom:-1px;height:1px;background:currentColor;opacity:var(--word-trail,0);pointer-events:none; }
/* Keep all nested hero words transparent in the outline copy, including Built. */
.type-outline,.type-outline * { -webkit-text-fill-color:transparent!important; }
.hero .type-outline .hero-title-line { color:transparent!important;-webkit-text-stroke:.8px var(--paper); }
.hero .type-outline .hero-title-line em { -webkit-text-stroke:.8px var(--blue); }
.text-response-word::after { display:none; }
.text-construction-trail { position:absolute;left:0;top:0;width:80px;height:1px;background:currentColor;opacity:0;pointer-events:none; }
.text-construction-trail::before,.text-construction-trail::after { content:'';position:absolute;width:1px;height:7px;top:-3px;background:currentColor; }
.text-construction-trail::before { left:0; }.text-construction-trail::after { right:0; }
/* A light hand-drawn double stroke replaces the dimension-line ticks. */
.text-construction-trail { height:9px;width:84px;background:none;background-color:currentColor;mask:url('/assets/images/sketch-underline.svg') center/100% 100% no-repeat; }
.text-construction-trail::before,.text-construction-trail::after { display:none; }

/* Body copy: barely perceptible word motion only, no underline. */
.text-construction-trail { display:none!important; }

/* Words wrap normally; each grapheme has independent subtle drift. */
.text-response-word { white-space:nowrap; }
.text-response-letter { display:inline-block; }
/* Tracing-paper texture over paragraphs; text itself remains completely still. */
.cursor-blob { overflow:hidden; }
.cursor-blob::after { content:'';position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:0;transition:opacity .35s ease;background-image:repeating-linear-gradient(35deg,transparent 0 6px,#b6c4d63b 6px 6.6px,transparent 6.6px 12px),repeating-linear-gradient(-35deg,transparent 0 8px,#b6c4d623 8px 8.6px,transparent 8.6px 15px); }
.cursor-blob.over-text-texture::after { opacity:.55; }
/* Word focus adds a little ink without changing metrics or paragraph wrapping. */
.blob-focus-word { transition:-webkit-text-stroke .2s ease; }
.blob-word-focused { -webkit-text-stroke:.22px currentColor; }
.cursor-blob.over-text-texture::after { opacity:0; }
/* Negative lens: invert the text and surface beneath the blob, without text clones. */
.cursor-blob { transition:background-color .22s ease,border-color .22s ease; }
.cursor-blob.negative-text-lens { background:#fff;border-color:#fff;mix-blend-mode:difference; }
.cursor-blob.negative-text-lens::after { opacity:0; }
/* Approved negative lens: ease in on contact, soften only the outer edge. */
.cursor-blob { isolation:auto; }
.cursor-blob::before { content:'';position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:#fff;opacity:var(--negative-strength,0);mask-image:radial-gradient(ellipse at center,#000 0 84%,transparent 100%); }
.cursor-blob::after { opacity:0!important; }
/* Terminal voice for supporting information and actions. */
:root { --technical-font:Consolas,'Lucida Console','Courier New',monospace; }
.eyebrow,.hero-meta,.hero-index,.about-location,.field-footer,.field-footer span,.instruction,.portfolio-note,.project-caption p,.project-caption>span,.price-billing,.package-price small,.pricing-provisional,.pricing-footnote,.footer,.footer p,.footer nav,.footer div,.button,.pricing-tabs { font-family:var(--technical-font); }
.button { font-weight:400;letter-spacing:.04em; }
.hero-meta { font-weight:400;letter-spacing:.16em; }
.field-footer { font-weight:400;letter-spacing:.05em; }
/* Tighter terminal annotations, with a brief decode response to the blob. */
.hero-meta,.eyebrow,.hero-index,.field-footer,.about-location,.project-caption p,.project-caption>span { font-family:'Lucida Console',Consolas,'Courier New',monospace;font-size:10px;font-weight:400;letter-spacing:.1em;font-variant-ligatures:none; }
.terminal-scramble { display:inline-block;white-space:pre-wrap;font-family:inherit; }
.hero-kicker::before,.about-strip>.eyebrow::before { content:'> ';color:var(--blue); }
/* Larger CMD-style annotations; decode only the characters beneath the blob. */
.hero-meta,.eyebrow,.hero-index,.field-footer,.about-location,.project-caption p,.project-caption>span { font-family:Consolas,'Courier New',monospace;font-size:12px;line-height:1.65;font-weight:400;letter-spacing:.06em;font-variant-ligatures:none; }
.terminal-character { display:inline-block;width:1ch;white-space:pre;text-align:center; }
.terminal-scramble { white-space:normal; }
@media(max-width:700px) { .hero-meta,.hero-index,.field-footer { font-size:11px;letter-spacing:.035em; } }
/* Share Tech Mono trial for the supporting computer-style voice. */
@font-face { font-family:'Share Tech Mono';src:url('/assets/fonts/design/share-tech-mono.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap; }
:root { --technical-font:'Share Tech Mono',monospace; }
.hero-meta,.eyebrow,.hero-index,.field-footer,.about-location,.project-caption p,.project-caption>span,.portfolio-note,.price-billing,.package-price small,.pricing-provisional,.pricing-footnote,.footer,.footer p,.footer nav,.footer div,.button,.pricing-tabs { font-family:var(--technical-font);font-weight:400; }
/* Stronger supporting type; Share Tech Mono has one native weight. */
.hero-meta,.eyebrow,.hero-index,.about-location,.project-caption p,.project-caption>span,.portfolio-note,.price-billing,.package-price small,.pricing-provisional,.pricing-footnote,.footer,.footer p,.footer nav,.footer div,.button,.pricing-tabs { font-size:14px;font-weight:700; }
.hero .hero-inner::after { display:none; }
@media(max-width:700px) { .hero-meta,.hero-index,.eyebrow,.project-caption p,.footer { font-size:12px; }.button,.pricing-tabs { font-size:13px; } }
/* Another step up in the supporting type scale. */
.hero-meta,.eyebrow,.hero-index,.about-location,.project-caption p,.project-caption>span,.portfolio-note,.price-billing,.package-price small,.pricing-provisional,.pricing-footnote,.footer,.footer p,.footer nav,.footer div,.button,.pricing-tabs { font-size:16px; }
.hero-services { display:flex;align-items:center;gap:.5em;flex-wrap:wrap; }
.service-dot { font-family:Arial,sans-serif;font-size:1.2em;font-weight:900;line-height:1; }
@media(max-width:700px) { .hero-meta,.hero-index,.eyebrow,.project-caption p,.footer { font-size:13px; }.button,.pricing-tabs { font-size:14px; } }

.hero-services .service-dot { font-family:var(--technical-font);font-size:1.2em;font-weight:700; }

.hero-services .service-dot { font-family:Arial,sans-serif;font-size:1.2em;font-weight:900; }
@font-face { font-family:'VT323';src:url('/assets/fonts/design/vt323.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap; }
.hero-terminal { position:absolute;right:0;bottom:40px;z-index:2;color:var(--blue);font:400 21px/1.3 'VT323',monospace;letter-spacing:.02em;min-height:28px;text-align:right;max-width:100%;pointer-events:none; }
.terminal-prompt { margin-right:6px; }.terminal-caret { animation:terminal-blink 1.1s steps(1) infinite; }
@keyframes terminal-blink { 50% { opacity:0; } }
@media(max-width:700px) { .hero-terminal { bottom:8px;font-size:18px; } }
@media(prefers-reduced-motion:reduce) { .terminal-caret { animation:none; } }
/* Button drafting guides: separate from the blob's localized fill. */
a.button { overflow:visible; }
a.button::before,a.button::after { content:'';position:absolute;pointer-events:none;width:26px;height:26px;opacity:0;transition:opacity .2s ease,transform .3s cubic-bezier(.2,.7,.2,1);background:linear-gradient(currentColor,currentColor) left 5px/26px 1px no-repeat,linear-gradient(currentColor,currentColor) 5px top/1px 26px no-repeat; }
a.button::before { left:-6px;top:-6px;transform:translate(5px,5px) scale(.7); }
a.button::after { right:-6px;bottom:-6px;transform:translate(-5px,-5px) rotate(180deg) scale(.7); }
a.button:hover::before,a.button:focus-visible::before { opacity:.55;transform:translate(-3px,-3px) scale(1); }
a.button:hover::after,a.button:focus-visible::after { opacity:.55;transform:translate(3px,3px) rotate(180deg) scale(1); }
a.button .icon-arrow { transition:transform .25s ease; }
a.button:hover .icon-arrow,a.button:focus-visible .icon-arrow { transform:translate(2px,-2px); }
@media(prefers-reduced-motion:reduce) { a.button::before,a.button::after,a.button .icon-arrow { transition:none; }a.button:hover .icon-arrow,a.button:focus-visible .icon-arrow { transform:none; } }
/* More pronounced construction motion. */
a.button::before,a.button::after { width:46px;height:46px;background:linear-gradient(currentColor,currentColor) left 9px/46px 1px no-repeat,linear-gradient(currentColor,currentColor) 9px top/1px 46px no-repeat;transition:opacity .2s ease,transform .45s cubic-bezier(.16,1,.3,1); }
a.button::before { left:-10px;top:-10px;transform:translate(9px,9px) scale(.35); }
a.button::after { right:-10px;bottom:-10px;transform:translate(-9px,-9px) rotate(180deg) scale(.35); }
a.button:hover::before,a.button:focus-visible::before { opacity:.85;transform:translate(-7px,-7px) scale(1); }
a.button:hover::after,a.button:focus-visible::after { opacity:.85;transform:translate(7px,7px) rotate(180deg) scale(1); }
a.button:hover .icon-arrow,a.button:focus-visible .icon-arrow { transform:translate(5px,-5px); }
a.button>.button-solid { position:relative; }
a.button>.button-solid::after { content:'';position:absolute;left:-10px;right:-10px;top:50%;height:1px;background:currentColor;opacity:0;transform:scaleX(0);transform-origin:left;pointer-events:none; }
a.button:hover>.button-solid::after,a.button:focus-visible>.button-solid::after { animation:button-measure .65s ease-out both; }
@keyframes button-measure { 0% { transform:scaleX(0);opacity:0; }25% { opacity:.4; }70% { transform:scaleX(1);opacity:.25; }100% { transform:scaleX(1);opacity:0; } }
@media(prefers-reduced-motion:reduce) { a.button::before,a.button::after { transition:none; }a.button:hover>.button-solid::after,a.button:focus-visible>.button-solid::after { animation:none; }a.button:hover .icon-arrow,a.button:focus-visible .icon-arrow { transform:none; } }
/* Construction guides stay alive while hovering, without moving the action itself. */
a.button:hover::before,a.button:focus-visible::before { animation:guide-drift-start 3.4s ease-in-out infinite; }
a.button:hover::after,a.button:focus-visible::after { animation:guide-drift-end 4.1s ease-in-out infinite; }
a.button:hover>.button-solid::after,a.button:focus-visible>.button-solid::after { animation:button-measure-loop 3.6s ease-in-out infinite; }
@keyframes guide-drift-start {
 0%,100% { transform:translate(-7px,-7px) scale(1);opacity:.75; }
 35% { transform:translate(-11px,-5px) scaleX(1.18) scaleY(.9);opacity:.9; }
 70% { transform:translate(-5px,-10px) scaleX(.9) scaleY(1.15);opacity:.65; }
}
@keyframes guide-drift-end {
 0%,100% { transform:translate(7px,7px) rotate(180deg) scale(1);opacity:.75; }
 40% { transform:translate(10px,5px) rotate(180deg) scaleX(.9) scaleY(1.16);opacity:.65; }
 75% { transform:translate(5px,11px) rotate(180deg) scaleX(1.15) scaleY(.9);opacity:.9; }
}
@keyframes button-measure-loop {
 0%,12% { transform:scaleX(0);opacity:0; }
 22% { opacity:.35; }
 40% { transform:scaleX(1);opacity:.2; }
 52%,100% { transform:scaleX(1);opacity:0; }
}
@media(prefers-reduced-motion:reduce) {
 a.button:hover::before,a.button:focus-visible::before,a.button:hover::after,a.button:focus-visible::after,a.button:hover>.button-solid::after,a.button:focus-visible>.button-solid::after { animation:none; }
}
@media(hover:none) { a.button:hover::before,a.button:hover::after,a.button:hover>.button-solid::after { animation:none; } }
/* Restrained drafting hover: almost stationary geometry, rotating arrow. */
a.button:hover .icon-arrow,a.button:focus-visible .icon-arrow { transform:rotate(45deg); }
a.button::before,a.button::after { width:32px;height:32px;background:linear-gradient(currentColor,currentColor) left 7px/32px 1px no-repeat,linear-gradient(currentColor,currentColor) 7px top/1px 32px no-repeat; }
a.button::before { left:-8px;top:-8px; }a.button::after { right:-8px;bottom:-8px; }
@keyframes guide-drift-start {
 0%,100% { transform:translate(-2px,-2px);opacity:.5; }
 50% { transform:translate(-3px,-2px);opacity:.65; }
}
@keyframes guide-drift-end {
 0%,100% { transform:translate(2px,2px) rotate(180deg);opacity:.5; }
 50% { transform:translate(2px,3px) rotate(180deg);opacity:.65; }
}
a.button:hover::before,a.button:focus-visible::before { animation-duration:5s; }
a.button:hover::after,a.button:focus-visible::after { animation-duration:5.8s; }
a.button>.button-solid::after { top:-23px;left:-28px;right:-28px;height:calc(100% + 46px);border:1px solid currentColor;background:none;transform:none;opacity:0;transition:opacity .3s ease; }
a.button:hover>.button-solid::after,a.button:focus-visible>.button-solid::after { animation:none;transform:none;opacity:.15; }
@media(prefers-reduced-motion:reduce) { a.button:hover .icon-arrow,a.button:focus-visible .icon-arrow { transform:none; } }
/* Disconnected drafting accents, with no enclosing rectangle. */
a.button>.button-solid::after { top:-27px;right:-31px;left:auto;width:7px;height:7px;border:1px solid currentColor;transform:translateY(3px);opacity:0;transition:opacity .25s .1s,transform .35s .1s;height:7px; }
a.button:hover>.button-solid::after,a.button:focus-visible>.button-solid::after { opacity:.6;transform:translateY(0); }
a.button>.button-solid::before { content:'';position:absolute;pointer-events:none;left:20%;bottom:-26px;width:20px;height:8px;opacity:0;transform:translateY(-3px);background:linear-gradient(currentColor,currentColor) center/20px 1px no-repeat,linear-gradient(currentColor,currentColor) center/1px 8px no-repeat;transition:opacity .25s .18s,transform .35s .18s; }
a.button:hover>.button-solid::before,a.button:focus-visible>.button-solid::before { opacity:.4;transform:translateY(0); }
a.button>.button-solid>.icon-arrow { position:relative; }
@media(prefers-reduced-motion:reduce) { a.button>.button-solid::before,a.button>.button-solid::after { transition:none; } }
/* Keep just the two offset corner guides. */
a.button>.button-solid::before,a.button>.button-solid::after { display:none; }
a.button::before { left:-14px;top:-14px; }
a.button::after { right:-14px;bottom:-14px; }
/* Slightly closer, textured corner strokes with a small hand-drawn wobble. */
a.button::before,a.button::after { width:34px;height:34px;background:currentColor;mask:url('/assets/images/sketch-button-guide.svg') center/100% 100% no-repeat; }
a.button::before { left:-11px;top:-11px; }
a.button::after { right:-11px;bottom:-11px; }
a.button:hover::before,a.button:focus-visible::before { animation:sketch-guide-start 3.5s ease-in-out infinite; }
a.button:hover::after,a.button:focus-visible::after { animation:sketch-guide-end 4s ease-in-out infinite; }
@keyframes sketch-guide-start { 0%,100% { transform:translate(-2px,-2px) rotate(-1deg);opacity:.6; }35% { transform:translate(-4px,-2px) rotate(1.8deg);opacity:.72; }70% { transform:translate(-2px,-4px) rotate(-1.5deg);opacity:.55; } }
@keyframes sketch-guide-end { 0%,100% { transform:translate(2px,2px) rotate(179deg);opacity:.6; }40% { transform:translate(3px,4px) rotate(181.8deg);opacity:.55; }75% { transform:translate(4px,2px) rotate(178.5deg);opacity:.72; } }
@media(prefers-reduced-motion:reduce) { a.button:hover::before,a.button:focus-visible::before,a.button:hover::after,a.button:focus-visible::after { animation:none; } }
/* Softer sketch-guide motion. */
@keyframes sketch-guide-start { 0%,100% { transform:translate(-2px,-2px) rotate(-.35deg);opacity:.6; }35% { transform:translate(-2.7px,-2px) rotate(.55deg);opacity:.66; }70% { transform:translate(-2px,-2.7px) rotate(-.45deg);opacity:.58; } }
@keyframes sketch-guide-end { 0%,100% { transform:translate(2px,2px) rotate(179.65deg);opacity:.6; }40% { transform:translate(2.3px,2.7px) rotate(180.55deg);opacity:.58; }75% { transform:translate(2.7px,2px) rotate(179.55deg);opacity:.66; } }
/* Shared action/navigation type and a proper header CTA. */
:root { --action-font:'Share Tech Mono',monospace; }
.button,.pricing-tabs,.header #navigation a,.menu-toggle { font-family:var(--action-font);font-weight:700; }
.header #navigation a { font-size:15px;letter-spacing:.025em; }
.header #navigation .nav-cta.button { display:inline-flex;align-items:center;justify-content:space-between;gap:18px;min-height:44px;padding:12px 16px;border:1px solid #92979d;background:transparent;color:var(--paper);text-transform:uppercase; }
.header #navigation .nav-cta.button::before,.header #navigation .nav-cta.button::after { border-bottom:0; }
.header #navigation .nav-cta.button .icon-arrow { width:18px;height:18px; }
@media(max-width:700px) { .header #navigation .nav-cta.button { width:100%;margin-top:10px; } }
/* Reset inherited header-span spacing so fill and label share the same origin. */
.header #navigation .nav-cta.button>span { margin:0; }
.button-fill { mask-size:100% 100%;mask-repeat:no-repeat;mask-position:0 0; }
/* Both main CTAs share the same action typography. */
.hero-actions .button,.header #navigation .nav-cta.button { font-family:var(--action-font);font-weight:700;font-size:15px;letter-spacing:.025em; }

/* Lighter action labels balance the thin button borders. */
.button,.hero-actions .button,.header #navigation .nav-cta.button,.pricing-package .button { font-weight:400; }
/* Approved regular weight across the technical/supporting voice. */
.hero-meta,.eyebrow,.hero-index,.about-location,.project-caption p,.project-caption>span,.portfolio-note,.price-billing,.package-price small,.pricing-provisional,.pricing-footnote,.footer,.footer p,.footer nav,.footer div,.button,.pricing-tabs,.header #navigation a,.menu-toggle,.hero-actions .button,.header #navigation .nav-cta.button { font-weight:400; }
/* Immediate navigation feedback, followed by the delayed blob's ink reveal. */
.header #navigation .nav-link { position:relative;display:inline-flex;color:var(--paper);border-bottom-color:transparent; }
.header #navigation .nav-link:hover,.header #navigation .nav-link:focus-visible { color:var(--paper);border-bottom-color:transparent; }
.header #navigation .nav-link>span { margin:0; }
.nav-link::after { content:'';position:absolute;bottom:3px;left:0;right:0;height:1px;background:var(--blue);transform:scaleX(0);transform-origin:left;transition:transform .18s ease;pointer-events:none; }
.nav-link:hover::after,.nav-link:focus-visible::after { transform:scaleX(1); }
.nav-ink { position:absolute;inset:0;padding:inherit;color:var(--blue);pointer-events:none;opacity:0;mask-size:100% 100%;mask-position:0 0;mask-repeat:no-repeat; }
.blob-nav-active>.nav-ink { opacity:1; }
@media(prefers-reduced-motion:reduce) { .nav-link::after { transition:none; } }
/* Only the top navigation uses regular weight. */
.hero-meta,.eyebrow,.hero-index,.about-location,.project-caption p,.project-caption>span,.portfolio-note,.price-billing,.package-price small,.pricing-provisional,.pricing-footnote,.footer,.footer p,.footer nav,.footer div,.button,.pricing-tabs,.hero-actions .button { font-weight:700; }
.header #navigation a,.header #navigation .nav-cta.button,.menu-toggle { font-weight:400; }
/* Close, white, drawn-on navigation underline; no blue blob ink. */
.header #navigation .nav-link { padding-bottom:10px; }
.header #navigation .nav-link::after { bottom:5px;height:6px;background:var(--paper);mask:url('/assets/images/nav-sketch-underline.svg') center/100% 100% no-repeat;transform:none;clip-path:inset(0 100% 0 0);transition:clip-path .3s cubic-bezier(.2,.65,.3,1); }
.header #navigation .nav-link:hover::after,.header #navigation .nav-link:focus-visible::after { transform:none;clip-path:inset(0 0 0 0); }
.header #navigation .nav-ink { display:none; }
@media(prefers-reduced-motion:reduce) { .header #navigation .nav-link::after { transition:none; } }
/* Uniform navigation ink and a stronger sketch line just beneath the glyphs. */
.header #navigation .nav-link,.header #navigation .nav-link:hover,.header #navigation .nav-link:visited,.header #navigation .nav-link[aria-current],.header #navigation .nav-link .nav-label { color:var(--paper);opacity:1; }
.header #navigation .nav-link::after { bottom:8px;height:7px;background:var(--paper);opacity:1;mix-blend-mode:normal; }
/* Fixed-size pencil texture keeps short and long links equally substantial. */
.header #navigation .nav-link::after { mask-image:url('/assets/images/nav-sketch-underline.svg');mask-size:32px 7px;mask-repeat:repeat-x;mask-position:left center;height:7px; }

.header #navigation .nav-link::after { mask-image:url('/assets/images/nav-sketch-underline.svg?v=visible2'); }

.button .icon-arrow { fill:none; }.button .icon-arrow path { vector-effect:non-scaling-stroke; }

/* Smaller, lightly irregular button construction strokes. */
a.button::before,a.button::after { width:30px;height:30px;mask-image:url('/assets/images/sketch-button-guide.svg?v=rough2'); }
/* Restore button guides; the refinement belongs to header underlines. */
a.button::before,a.button::after { width:34px;height:34px;mask-image:url('/assets/images/sketch-button-guide.svg?v=restored'); }
.header #navigation .nav-link::after { left:2px;right:2px;mask-image:url('/assets/images/nav-sketch-underline.svg?v=lighter-rough');mask-size:48px 7px; }
/* Body font trial: readable Geist prose, terminal-style captions retained. */
@font-face { font-family:'Geist';src:url('/assets/fonts/design/geist-regular.woff2') format('woff2');font-weight:100 900;font-style:normal;font-display:swap; }
:root { --body-font:'Geist',Arial,sans-serif; }
body { font-family:var(--body-font); }
.hero-description,.about-copy p,.package-description,.pricing-intro>p,.pricing-extras .extras-intro>p:not(.eyebrow),.about-principles p,.cta-bottom p { font-family:var(--body-font);font-weight:400;font-size:18px;line-height:1.65; }
.portfolio-note { font-family:var(--technical-font); }
@media(max-width:700px) { .hero-description,.about-copy p,.package-description,.pricing-intro>p,.pricing-extras .extras-intro>p:not(.eyebrow),.about-principles p,.cta-bottom p { font-size:17px; } }

/* Body comparison: Share Tech Mono at the same readable size and spacing. */
:root { --body-font:'Share Tech Mono',monospace; }