/* Visual rhythm and progressive motion, above the legacy page styles. */
:root {
  --fs-muted:#535b55;
  --fs-section:clamp(56px,6vw,88px);
  --fs-ease:cubic-bezier(.22,1,.36,1);
  --fs-dark:#131918;
  --fs-on-dark:#f5f3ed;
  --fs-muted-dark:#bdc6bd;
}
html { overflow-x:clip; }
body.structured-page { overflow-x:clip; }
.structured-page :is(h1,h2,h3) { text-wrap:balance; }
.structured-page :is(.fs-heading h2,.fs-title,.web-heading h2,.video-heading h2,.video-estimate h3,.contact-copy h2) {
  font-weight:500; letter-spacing:-.045em; line-height:1.08;
}
.structured-page :is(.fs-project h3,.fs-service-card h2,.fs-scope-card h3,.fs-photo-set h3) { letter-spacing:-.035em; }
.structured-page :is(.fs-service-card p,.fs-project p,.fs-scope-card p,.fs-scope-card li,.fs-steps p,.fs-video-card p,.fs-photo-set p) { font-size:15px; line-height:1.65; }
.fs-eyebrow { font-size:12px; letter-spacing:.065em; }
.fs-project-meta { font-size:12px; line-height:1.5; flex-wrap:wrap; gap:4px 14px; }
.fs-hero h1 { font-size:clamp(50px,5.55vw,82px); letter-spacing:-.055em; line-height:1.02; }
.fs-hero h1 em { font-size:.62em; letter-spacing:-.025em; line-height:1.15; margin-top:20px; }
.fs-hero { grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr); min-height:0; padding-block:clamp(42px,5vw,72px); gap:clamp(30px,4vw,64px); }
.fs-hero-lead { font-size:16px; line-height:1.65; max-width:48ch; }
.fs-hero-price { display:flex; flex-wrap:wrap; gap:5px 20px; font-size:14px; line-height:1.55; }
.fs-hero-price>span { white-space:nowrap; }
.fs-hero-work { transition:transform 650ms var(--fs-ease); }
.fs-motion-on .fs-hero-work:is(:hover,:focus-within) { transform:rotate(0deg); }
.fs-page-intro { padding-bottom:40px; }
.fs-page-intro h1 { letter-spacing:-.045em; font-size:clamp(44px,5.4vw,80px); }
.fs-heading { margin-bottom:36px; }
.fs-heading p { font-size:16px; }
.fs-section + .fs-section:not(.fs-contrast) { border-top:1px solid var(--fs-line); }
.fs-page-links { gap:12px 28px; }
.fs-page-links a { text-decoration-thickness:1px; text-underline-offset:5px; }

/* Navigation keeps a readable size before switching to its mobile layout. */
.site-header-shared .site-nav { font-size:13px; font-weight:600; gap:clamp(15px,1.6vw,26px); text-transform:none; }
.site-header-shared .site-nav a { text-transform:none; }
.site-header-shared .site-nav a:hover { opacity:1; color:#fff; }
.site-header-shared .site-nav a:not(.site-nav-cta):hover { border-bottom-color:#83948b; }
.site-header-shared .site-nav .site-nav-cta { padding-inline:18px; }
.site-header-shared .lang-switch button { min-height:36px; min-width:34px; color:#d5dbd3; }
.site-header-shared .lang-switch button[aria-pressed=true] { color:#fff; }
.site-motion-button { display:inline-flex; justify-content:center; align-items:center; gap:7px; min-height:44px; padding:8px; color:#d5dbd3; border:0; background:none; font:inherit; font-size:12px; cursor:pointer; }
.site-motion-button[hidden] { display:none; }
.site-motion-icon { display:block; width:13px; height:13px; border:1px solid currentColor; border-radius:50%; position:relative; }
.site-motion-icon::after { content:''; position:absolute; inset:3px; background:currentColor; }
.site-motion-button[aria-pressed=false] .site-motion-icon::after { inset:3px 2px 3px 4px; background:none; border-left:4px solid currentColor; border-block:3px solid transparent; }
.site-header-shared::after { content:''; position:absolute; inset:auto 0 -1px; height:2px; background:#f25663; transform-origin:left; transform:scaleX(var(--fs-reading,0)); pointer-events:none; }
.site-header-shared .brand-bar { transition:transform 300ms var(--fs-ease); }
.fs-motion-on .site-header-shared .brand:hover .brand-bar { transform:translateX(3px); }

/* Paper for choosing, graphite for looking at the work. */
.fs-contrast {
  --fs-muted:var(--fs-muted-dark); --fs-line:#46514a;
  max-width:none; background:var(--fs-dark); color:var(--fs-on-dark);
  padding-inline:max(var(--fs-edge),calc((100% - 1600px)/2 + var(--fs-edge)));
}
.fs-contrast .fs-project figure { border-color:#4b554d; background:#29312c; }
.fs-contrast .fs-project-note { color:#ff9aa2; }
.fs-contrast .fs-photo-grid img { background:#2b332e; }
.fs-contrast :focus-visible { outline-color:#fff; }
.fs-contrast .fs-button-secondary { color:var(--fs-on-dark); border-color:#7e8d83; }
.fs-contrast .fs-button-secondary:hover { background:#303c35; }
.fs-auto-brief { margin-top:44px; padding-top:30px; }
.fs-content-teasers { margin-top:0; }
.fs-content-teaser { border:0; padding:0; grid-template-columns:160px minmax(0,1fr); }
.fs-content-teaser img { width:160px; height:200px; }
.fs-content-teaser h3 { font-size:clamp(26px,2.5vw,38px); }
.fs-service-card { display:flex; flex-direction:column; align-items:flex-start; padding-block:32px; }
.fs-service-card .fs-link { margin-top:auto; }
.fs-service-card .fs-service-price { margin-top:8px; margin-bottom:18px; }
.fs-service-card::before { content:''; position:absolute; left:26px; right:26px; bottom:-1px; height:2px; background:var(--fs-red); transform:scaleX(0); transform-origin:left; transition:transform 350ms var(--fs-ease); }
.fs-service-card:first-child::before { left:0; }
.fs-service-card:last-child::before { right:0; }
.fs-service-card:focus-within::before,.fs-service-card:hover::before { transform:scaleX(1); }
.fs-project figure { transition:box-shadow 350ms var(--fs-ease); }
.fs-project img { transition:transform 650ms var(--fs-ease); }
.fs-project-open { width:44px; height:44px; transition:background 250ms,color 250ms,transform 350ms var(--fs-ease); }
.fs-project:is(:hover,:focus-visible) .fs-project-open { color:#fff; background:var(--fs-red); }
.fs-project:is(:hover,:focus-visible) figure { box-shadow:0 12px 30px #0002; }
.fs-button,.fs-link,.web-package-cta,.video-button { transition:background 200ms,color 200ms,border-color 200ms; }
.fs-button>span:last-child,.fs-link>span:last-child,.web-package-cta>span:last-child { transition:transform 300ms var(--fs-ease); }
.fs-motion-on :is(.fs-button,.fs-link,.web-package-cta):is(:hover,:focus-visible)>span:last-child { transform:translate(3px,-3px); }
.fs-motion-on .fs-project:is(:hover,:focus-visible) .fs-project-open { transform:rotate(45deg); }
.fs-motion-on .fs-project:is(:hover,:focus-visible) img { transform:scale(1.035); }

.structured-page .web-packages { background:var(--fs-paper); color:var(--fs-ink); }
.structured-page .web-packages .web-heading p:last-child { color:var(--fs-muted); }
.structured-page .web-package { padding:clamp(24px,3vw,42px); background:#fffefa; border:1px solid #b9beb4; border-top:3px solid var(--fs-red); }
.structured-page :is(.web-package-description,.web-package-facts dd,.web-package-timing,.web-package-header>span:last-child) { color:var(--fs-muted); }
.structured-page .web-package-facts dt,.web-package-header { font-size:12px; letter-spacing:.02em; }
.structured-page .web-package-facts dd { font-size:15px; }
.structured-page .web-price { letter-spacing:-.045em; }
.structured-page .web-included-grid p,.structured-page .web-boundaries p { color:var(--fs-muted); }
.structured-page .web-included-grid p { border-color:var(--fs-line); }
.structured-page .web-included-grid strong,.structured-page .web-boundaries strong { color:var(--fs-ink); font-weight:600; }
.structured-page .web-heading { grid-template-columns:.55fr 1.45fr; }
.structured-page :is(.web-section,.video-section) { padding-inline:max(var(--fs-edge),calc((100% - 1600px)/2 + var(--fs-edge))); }
.structured-page :is(.web-section>header,.web-section>div,.video-container) { max-width:1472px; }
.structured-page .video-heading h2 { font-size:clamp(32px,4.2vw,60px); }
.structured-page .video-scope { background:#e6e8df; }
.structured-page .video-estimate h3 { max-width:17ch; }
.fs-video-card video { border:1px solid #5e6860; }
.fs-photo-set { padding-top:30px; margin-bottom:52px; }
.fs-photo-grid>a,.fs-photo-personal>a:first-child { position:relative; overflow:hidden; }
.fs-photo-grid img { transition:transform 600ms var(--fs-ease); }
.fs-photo-grid a::after,.fs-photo-personal>a:first-child::after { content:'↗'; position:absolute; right:12px; bottom:12px; display:grid; place-items:center; width:44px; height:44px; background:#f6f5ef; color:#161d19; font-size:23px; border-radius:50%; }
.fs-motion-on .fs-photo-grid a:is(:hover,:focus-visible) img { transform:scale(1.035); }
.work-filters { gap:10px; border-bottom:1px solid var(--fs-line); margin-bottom:32px; }
.work-filters a { transition:border-color 180ms; }
.work-filters a[aria-current=true]::before { content:''; width:5px; height:5px; background:currentColor; border-radius:50%; margin-right:8px; }
.work-filters a:hover { border-color:var(--fs-ink); }

/* The first screen has one stage: no pinning, auto-advance or scroll capture. */
.fs-showcase { min-width:0; }
.fs-showcase-toolbar { display:flex; align-items:center; justify-content:space-between; gap:10px; border-bottom:1px solid var(--fs-line); padding-bottom:12px; }
.fs-showcase-controls { display:flex; gap:6px; }
.fs-showcase-controls[hidden] { display:none; }
.fs-showcase-controls button { min-height:44px; padding:10px 18px; border:1px solid transparent; border-radius:0; background:transparent; color:var(--fs-muted); font:inherit; font-size:14px; cursor:pointer; transition:border-color 180ms; }
.fs-showcase-controls button[aria-pressed=true] { color:#fff; background:var(--fs-ink); }
.fs-showcase-controls button:is(:hover,:focus-visible) { border-color:var(--fs-ink); }
.fs-showcase-index { color:var(--fs-muted); font-size:12px; font-variant-numeric:tabular-nums; white-space:nowrap; }
.fs-showcase-stage { position:relative; aspect-ratio:1.22; }
.fs-showcase-panel { position:absolute; inset:0; }
.fs-showcase-panel[hidden] { display:none; }
.fs-stage-sites figure { position:absolute; margin:0; border:1px solid #aab1a5; background:#151a17; box-shadow:0 18px 36px #2134251c; }
.fs-stage-sites figure:first-child { width:91%; left:0; top:8%; transform:translateY(var(--fs-frame-y,0px)) rotate(-2deg); }
.fs-stage-sites figure+figure { width:66%; right:0; bottom:4%; transform:translateY(calc(var(--fs-frame-y,0px)*-.5)) rotate(3deg); }
.fs-stage-sites img { width:100%; height:auto; aspect-ratio:1.65; object-fit:cover; object-position:top; }
.fs-stage-sites figcaption { display:flex; gap:10px; align-items:center; justify-content:space-between; padding:9px 12px; color:#f2f2ec; font-size:12px; line-height:1.3; }
.fs-stage-sites figcaption>span:last-child { font-size:11px; color:#c9d2c9; }
.fs-stage-photos { display:grid; grid-template-columns:1fr 1fr 1fr; gap:12px; align-items:center; padding-block:28px; }
.fs-stage-photos a { display:block; }
.fs-stage-photos a:nth-child(2) { transform:translateY(-20px); }
.fs-stage-photos a:nth-child(3) { transform:translateY(20px); }
.fs-stage-photos img { width:100%; height:auto; aspect-ratio:3/5; object-fit:cover; background:#dce0d6; box-shadow:0 10px 25px #1020101c; }
.fs-stage-video { display:grid; grid-template-columns:1.1fr 1fr; gap:24px; padding-block:22px; align-items:center; }
.fs-stage-video video { display:block; width:100%; max-height:440px; aspect-ratio:1080/1912; object-fit:contain; background:#111; }
.fs-stage-video-copy { border-top:1px solid var(--fs-line); padding-top:22px; }
.fs-stage-video-copy h2 { font-size:clamp(24px,3vw,40px); font-weight:500; letter-spacing:-.04em; }
.fs-stage-video-copy p { color:var(--fs-muted); font-size:14px; line-height:1.6; margin:16px 0; }
.fs-stage-video-copy .fs-link { font-size:13px; }
.fs-showcase-caption { display:flex; justify-content:space-between; gap:18px; border-top:1px solid var(--fs-line); padding-top:14px; font-size:12px; line-height:1.5; color:var(--fs-muted); }
.fs-showcase-caption a { text-decoration:underline; text-underline-offset:3px; min-height:36px; }
.fs-showcase-caption p { max-width:38ch; }

/* Large native image viewer; original image links remain the fallback. */
.fs-lightbox { max-width:none; max-height:none; width:100%; height:100%; margin:0; padding:22px max(22px,4vw); border:0; color:#f5f4ef; background:#111715; }
.fs-lightbox::backdrop { background:#111715ed; }
.fs-lightbox[open] { display:grid; grid-template-rows:auto minmax(0,1fr) auto; gap:16px; }
.fs-lightbox-bar { display:flex; align-items:center; justify-content:space-between; gap:18px; }
.fs-lightbox button { min-height:46px; min-width:46px; padding:9px 16px; border:1px solid #718178; background:transparent; color:inherit; font:inherit; cursor:pointer; }
.fs-lightbox button:hover { background:#33413a; }
.fs-lightbox :focus-visible { outline:2px solid #fff; outline-offset:4px; }
.fs-lightbox-stage { min-height:0; display:grid; place-items:center; position:relative; }
.fs-lightbox img { height:100%; width:100%; min-height:0; object-fit:contain; }
.fs-lightbox-status { position:absolute; inset:auto 14px 14px; padding:10px 14px; background:#111e; font-size:14px; text-align:center; }
.fs-lightbox-status[hidden] { display:none; }
.fs-lightbox-footer { display:grid; grid-template-columns:46px minmax(0,1fr) 46px; align-items:center; gap:20px; }
.fs-lightbox-footer p { font-size:14px; line-height:1.5; text-align:center; }
.fs-lightbox-footer button { font-size:22px; padding:6px; }
.fs-lightbox-count { font-size:13px; color:#c2cec5; }
html.fs-lightbox-open { overflow:hidden; scrollbar-gutter:stable; }

.structured-page .contact-section { padding-block:var(--fs-section); gap:clamp(30px,4vw,64px); grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr); background:var(--fs-dark); }
.structured-page .contact-copy h2 { font-size:clamp(36px,4.4vw,64px); margin-top:24px; }
.structured-page .contact-copy>p { color:#c3ccc3; font-size:17px; max-width:43ch; }
.structured-page .contact-links { margin-top:30px; }
.structured-page .contact-links span { font-size:12px; color:#bbc6bc; letter-spacing:.035em; }
.structured-page .contact-links strong { font-size:15px; font-weight:500; }
.structured-page .lead-form { padding:clamp(24px,3vw,42px); gap:24px 22px; background:#f4f2ec; }
.structured-page .form-field label { font-size:12px; font-weight:600; letter-spacing:.015em; text-transform:none; }
.structured-page .selected-package span { font-size:11px; color:#bdc8bd; }
.structured-page .form-field :is(input,textarea)::placeholder { color:#59615b; opacity:1; }
.structured-page .form-note,.structured-page .lead-field-hint { color:#555e56; }
.structured-page .lead-details summary { min-height:44px; line-height:1.6; }
.site-footer { border-top:1px solid #46514a; }
.site-footer-label { font-size:12px; }
.site-footer-bottom { font-size:13px; }
.site-footer-other a { min-height:44px; }
.structured-page .service-dark .scope-grid>article>span:first-child { color:#ff9199; }
.structured-page .service-continuation .text-link { color:var(--fs-ink); border-color:var(--fs-ink); }

@media(min-width:1001px) and (max-width:1200px) {
  .site-header-shared { padding-inline:28px; }
  .site-header-shared .brand { font-size:21px; }
  .site-header-shared .site-nav { gap:14px; font-size:12px; }
  .site-header-shared .site-nav .site-nav-cta { padding-inline:12px; }
}
@media(max-width:1000px) {
  .structured-page { padding-top:70px; }
  .site-header-shared { min-height:70px; padding:12px var(--fs-edge); }
  .site-header-shared .brand { font-size:21px; gap:10px; }
  .site-header-shared .brand-bar { width:28px; height:20px; }
  .js .site-menu-toggle { display:flex; }
  .site-header-shared .site-nav { position:absolute; top:100%; left:0; right:0; display:flex; flex-direction:column; align-items:stretch; gap:0; background:#111514; padding:12px var(--fs-edge) 24px; font-size:18px; max-height:calc(100svh - 70px); overflow:auto; border-bottom:1px solid #647267; }
  .site-header-shared .site-nav a { min-height:50px; padding:12px 0; }
  .site-header-shared .site-nav .site-nav-cta { padding:14px 18px; margin-top:10px; }
  .js .site-header-shared:not([data-menu-open=true]) .site-nav { display:none; }
  .site-header-shared .lang-switch { align-self:flex-start; margin-top:12px; }
  .site-header-shared .lang-switch button { min-height:44px; min-width:44px; }
  .site-motion-button { align-self:flex-start; margin-top:12px; padding-inline:0; font-size:14px; }
  html:not(.js) .site-header-shared { position:relative; flex-wrap:wrap; }
  html:not(.js) body.structured-page { padding-top:0; }
  html:not(.js) .site-header-shared .site-nav { position:static; flex-direction:row; flex-wrap:wrap; gap:14px; font-size:14px; padding:0; }
  .work-filters { top:70px; }
  .structured-page .contact-section { grid-template-columns:1fr; }
  .contact-copy { max-width:760px; }
  .fs-content-teaser { grid-template-columns:110px minmax(0,1fr); gap:20px; }
  .fs-content-teaser img { width:110px; height:155px; }
}
@media(max-width:900px) {
  .fs-hero { grid-template-columns:1fr; gap:36px; }
  .fs-hero h1 { max-width:13ch; font-size:clamp(48px,7.5vw,72px); }
  .fs-hero h1 em { font-size:.64em; }
  .fs-hero-work { width:min(100%,680px); margin:0 auto; }
  .fs-showcase { width:min(100%,680px); margin:0 auto; }
  .fs-service-card h2 { font-size:28px; }
}
@media(max-width:760px) {
  .site-header-shared .brand { font-size:18px; }
  .fs-hero { padding-block:36px 42px; }
  .fs-hero h1 { font-size:clamp(46px,11vw,68px); max-width:none; }
  .structured-page[data-page=service] .fs-hero h1 { font-size:clamp(39px,10.4vw,64px); }
  .fs-hero h1 em { max-width:15ch; margin-top:18px; }
  .fs-eyebrow { font-size:11px; }
  .fs-hero-lead { font-size:16px; }
  .fs-hero .fs-actions { gap:12px; }
  .fs-hero .fs-button { padding-inline:18px; gap:20px; }
  .fs-hero-price { text-wrap:balance; }
  .fs-service-card { padding-block:27px; }
  .fs-service-card h2 { font-size:32px; }
  .fs-service-card::before { left:0; right:0; }
  .fs-content-teaser { grid-template-columns:110px minmax(0,1fr); }
  .fs-content-teasers { gap:32px; }
  .fs-heading { margin-bottom:28px; }
  .fs-project h3 { font-size:27px; }
  .fs-project-meta { font-size:11px; }
  .fs-auto-brief { margin-top:32px; }
  .structured-page .web-heading { grid-template-columns:1fr; gap:20px; }
  .structured-page .web-package { padding:24px; }
  .fs-photo-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
  .fs-photo-triptych>a:first-child { grid-column:1/-1; }
  .fs-photo-triptych>a:first-child img { aspect-ratio:4/4.7; }
  .fs-showcase-controls button { padding:9px 14px; font-size:13px; }
  .fs-showcase-stage { aspect-ratio:1.03; }
  .fs-stage-sites figcaption>span:last-child { display:none; }
  .fs-stage-sites figure:first-child { top:8%; width:96%; }
  .fs-stage-sites figure+figure { width:76%; bottom:9%; }
  .fs-stage-sites figcaption { padding:7px 9px; font-size:11px; }
  .fs-stage-photos { gap:9px; }
  .fs-stage-photos img { aspect-ratio:3/6; }
  .fs-stage-video { grid-template-columns:1fr .9fr; gap:16px; }
  .fs-stage-video video { max-height:320px; }
  .fs-stage-video-copy { padding-top:12px; }
  .fs-stage-video-copy h2 { font-size:25px; }
  .fs-stage-video-copy p { font-size:12px; margin-block:10px; }
  .fs-showcase-caption { font-size:12px; }
  .fs-lightbox { padding:14px; gap:12px; }
  .fs-lightbox-footer { gap:12px; }
  .fs-lightbox-footer p { font-size:13px; }
  .structured-page .contact-copy h2 { font-size:40px; }
  .structured-page .contact-copy>p { font-size:16px; }
  .structured-page .contact-links a { gap:14px; }
  .structured-page .contact-links strong { font-size:14px; }
  .structured-page .lead-form { padding:24px 20px; }
}
@media(prefers-reduced-motion:reduce) {
  html:not(.fs-motion-opt-in) { scroll-behavior:auto; }
}
.fs-motion-off { scroll-behavior:auto; }
.fs-motion-off .structured-page *, .fs-motion-off .structured-page *::before, .fs-motion-off .structured-page *::after { transition-duration:0s!important; animation:none!important; }
.fs-motion-off .fs-project:hover img,.fs-motion-off .fs-project:focus-visible img { transform:none; }
.fs-motion-off .fs-stage-sites figure:first-child { transform:rotate(-2deg); }
.fs-motion-off .fs-stage-sites figure+figure { transform:rotate(3deg); }

/* Preserve the complete landscape cover in the existing home teaser. */
.fs-content-teaser-landscape img { object-fit:contain; background:var(--fs-ink); }