/* Field direction: a still photograph, with space opening around the work.
   Layout stays in normal flow. The frame moves; people and artwork do not. */
.journey-statement {min-height:0;padding:136px var(--gutter) 38px;gap:28px;justify-content:flex-start}
.intro-composition {padding:0}
.journey-statement .statement-word {max-width:100%;overflow-wrap:anywhere}
.journey-statement .intro-composition h1 {font-size:clamp(52px,7.5vw,144px);line-height:1.04}
.journey-statement .intro-composition h1 em {width:auto;max-width:none;margin:.13em 0 0;padding:0;text-align:right;font-size:.94em;line-height:1.1}
.intro-bottom {margin-top:8px;align-items:center;gap:24px}
.intro-purpose {font-size:16px;line-height:1.6;max-width:43ch;margin:0}
.intro-actions {flex-direction:row;align-items:center;flex-wrap:wrap;max-width:100%;gap:28px}
.intro-contact {min-width:230px;min-height:54px;gap:28px}
.intro-film {margin:0;min-height:44px;gap:18px}
.opening-field {margin:0;padding:0 var(--gutter) 0;background:#fcfbf8}
.opening-aperture {position:relative;height:clamp(320px,38vw,820px);--frame-inset:0px;--frame-line:#eee8da}
.opening-aperture picture {position:absolute;inset:0;display:block;clip-path:inset(0 var(--frame-inset));background:#e6e0d4}
/* Keep wall above the installed work visible without extending the photograph. */
.opening-aperture img {width:100%;height:100%;object-fit:cover;object-position:50% 20%}
.opening-aperture::after {content:"";position:absolute;pointer-events:none;inset:10px calc(var(--frame-inset) + 10px);background:linear-gradient(var(--frame-line),var(--frame-line)) left top/24px 1px no-repeat,linear-gradient(var(--frame-line),var(--frame-line)) left top/1px 24px no-repeat,linear-gradient(var(--frame-line),var(--frame-line)) right top/24px 1px no-repeat,linear-gradient(var(--frame-line),var(--frame-line)) right top/1px 24px no-repeat,linear-gradient(var(--frame-line),var(--frame-line)) left bottom/24px 1px no-repeat,linear-gradient(var(--frame-line),var(--frame-line)) left bottom/1px 24px no-repeat,linear-gradient(var(--frame-line),var(--frame-line)) right bottom/24px 1px no-repeat,linear-gradient(var(--frame-line),var(--frame-line)) right bottom/1px 24px no-repeat;opacity:.8}
.opening-field figcaption {display:flex;align-items:baseline;justify-content:space-between;gap:20px;padding:16px 0 22px;color:#686357;font-size:12px;line-height:1.5}
.opening-field figcaption strong {font-weight:400;color:var(--ink);font-size:15px}
.opening-unavailable {display:none;position:absolute;inset:0;align-items:center;justify-content:center;text-align:center;font-size:16px;padding:30px;color:#686357}
.opening-field[data-photo=error] .opening-unavailable {display:flex}
.opening-field[data-photo=error] picture {visibility:hidden}
.opening-field[data-photo=error] .opening-aperture {height:140px;background:#ece7dd}
.opening-field[data-photo=error] .opening-aperture::after {--frame-line:#a69b89}
#services {padding-top:56px}
picture.field-frame {position:relative}
picture.field-frame::after {content:"";position:absolute;inset:9px;pointer-events:none;background:linear-gradient(#faf7ecbb,#faf7ecbb) left top/18px 1px no-repeat,linear-gradient(#faf7ecbb,#faf7ecbb) left top/1px 18px no-repeat,linear-gradient(#faf7ecbb,#faf7ecbb) right bottom/18px 1px no-repeat,linear-gradient(#faf7ecbb,#faf7ecbb) right bottom/1px 18px no-repeat}
/* Preserve the full wording and a usable CTA as type grows. */
@media (min-width:701px) and (max-height:750px) {
 .journey-statement {padding-top:108px;padding-bottom:26px;gap:20px}
 .journey-statement .intro-composition h1 {font-size:clamp(46px,6.6vw,108px)}
 .intro-purpose {font-size:15px}.intro-actions {gap:20px}
 .opening-aperture {height:clamp(280px,36vw,760px)}
}
@media (min-width:701px) and (max-width:1100px) {
 .intro-actions {gap:20px}.intro-contact {min-width:180px;padding:12px 16px}
 .intro-purpose {max-width:35ch;font-size:15px}
 .intro-film {font-size:12px;max-width:12ch}
}
@media (max-width:700px) {
 .journey-statement {padding:110px var(--gutter) 25px;gap:23px}
 .intro-masthead {display:flex;flex-wrap:wrap;gap:12px 20px;align-items:start}
 .intro-location {font-size:13px;white-space:nowrap}
 .intro-reach {font-size:12px;text-align:right;max-width:13ch;margin:0}
 .journey-statement .intro-composition h1 {font-size:clamp(39px,10.8vw,70px);line-height:1.06}
 .journey-statement .intro-composition h1 em {font-size:1.04em;max-width:16ch;margin:.28em 0 0;line-height:1.08;text-align:left}
 .intro-bottom {display:block;margin:0;padding:0}
 .intro-purpose {font-size:16px;line-height:1.55;max-width:34ch}
 .intro-actions {display:flex;flex-direction:row;flex-wrap:wrap;gap:10px 20px;margin-top:20px}
 .intro-contact {font-size:15px;min-width:184px;min-height:50px;padding:12px 16px;gap:18px}
 .intro-film {font-size:12px;gap:10px;min-height:44px}
 .opening-aperture {height:clamp(250px,72vw,400px)}
 .opening-aperture img {object-position:50% 40%}
 .opening-aperture::after {inset:8px calc(var(--frame-inset) + 8px);background-size:18px 1px,1px 18px,18px 1px,1px 18px,18px 1px,1px 18px,18px 1px,1px 18px}
 .opening-field figcaption {display:block;padding:13px 0 6px;font-size:11px}
 .opening-field figcaption strong {display:block;font-size:14px;margin-bottom:4px}
 #services {padding-top:39px}
}
@media(prefers-reduced-motion:reduce) {.opening-aperture {--frame-inset:0px!important}}

/* The installed result and the planning study read as one sequence. */
.journey-statement .intro-composition h1 {font-size:clamp(52px,7.8vw,144px)}
.journey-statement .intro-composition h1 em {margin-top:.08em}
.intro-purpose {max-width:52ch;font-size:17px}
.opening-field figcaption {padding:20px 0 24px;font-size:13px}
.opening-field figcaption strong {font-size:17px}
.opening-field + .work-section {padding-top:0;background:#fcfbf8}
.opening-field + .work-section .section-top {position:relative;border:0;padding:42px 0 18px}
.opening-field + .work-section .section-top::before {content:"";position:absolute;left:0;top:0;width:1px;height:28px;background:var(--brand-red)}
.opening-field + .work-section .section-top .eyebrow {font-size:12px;letter-spacing:.04em;color:#686357}
.opening-field + .work-section .work-heading {margin:12px 0 36px}
.opening-field + .work-section .work-heading h2 {max-width:19ch;font-size:clamp(38px,4.3vw,72px)}
.opening-field + .work-section .work-heading>p {max-width:36ch;font-size:17px;line-height:1.6}
.opening-field + .work-section .work-experience {border-top:0}
@media(min-width:701px) and (max-width:1100px) {
 .opening-field + .work-section .work-heading {display:block}
 .opening-field + .work-section .work-heading h2 {max-width:none}
 .opening-field + .work-section .work-heading>p {max-width:52ch;margin-top:18px}
}
@media(min-width:1101px) {
 .journey-statement {display:grid;grid-template-columns:minmax(0,1.85fr) minmax(280px,.85fr);column-gap:clamp(48px,5vw,90px);row-gap:30px;align-items:center;padding-bottom:38px}
 .intro-masthead {grid-column:1/-1}
 .intro-composition {grid-column:1;min-width:0}
 .journey-statement .intro-composition h1 {font-size:clamp(62px,6.5vw,120px);line-height:1.06}
 .journey-statement .intro-composition h1 em {font-size:1.02em;text-align:left;white-space:normal;margin-top:.12em}
 .intro-bottom {grid-column:2;display:flex;flex-direction:column;align-items:flex-start;gap:22px;margin:0;padding:12px 0 0}
 .intro-purpose {max-width:32ch;line-height:1.65}
 .intro-purpose br {display:none}
 .intro-actions {margin:0}
}
@media(max-width:700px) {
 .journey-statement .intro-composition h1 {font-size:clamp(38px,11.3vw,70px);text-wrap:balance}
 .journey-statement .intro-composition h1 em {max-width:15ch;margin-top:.2em;font-size:1.05em;text-wrap:balance}
 .intro-purpose {font-size:16px;max-width:34ch}
 .opening-field figcaption {padding:16px 0 20px;font-size:12px;line-height:1.6}
 .opening-field figcaption strong {font-size:16px}
 .opening-field + .work-section .section-top {padding-top:36px;padding-bottom:12px}
 .opening-field + .work-section .section-top::before {height:22px}
 .opening-field + .work-section .section-top .eyebrow {font-size:11px}
 .opening-field + .work-section .work-heading {margin:8px 0 28px}
 .opening-field + .work-section .work-heading h2 {font-size:clamp(34px,10vw,48px);line-height:1.1}
 .opening-field + .work-section .work-heading>p {font-size:16px;margin-top:16px}
}
@media(min-width:701px) and (max-height:750px) {
 .journey-statement .intro-composition h1 {font-size:clamp(46px,6.6vw,108px)}
}
@media(min-width:1101px) and (max-height:750px) {
 .journey-statement .intro-composition h1 {font-size:clamp(60px,6.5vw,108px)}
}
.intro-purpose strong {color:var(--ink);font-weight:500}
