/* Service pages and contact page. */
.ea-service, .ea-contact { padding-top: var(--site-header-height); }
.ea-service ::selection, .ea-contact ::selection { background: var(--ea-wine); color: var(--ea-paper-light); }

/* Stage: text on the left, the cover photo stays in view on the right. */
.ea-service__stage, .ea-contact__stage { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: start; }
.ea-service__text { grid-column: 1; grid-row: 1; padding: clamp(3rem, 7vh, 5.5rem) clamp(2rem, 5vw, 6rem) clamp(4rem, 8vw, 7rem) var(--ea-gutter); }
.ea-service__cover, .ea-contact__photo { position: sticky; top: var(--site-header-height); height: calc(100svh - var(--site-header-height)); min-height: 32rem; }
.ea-service__cover { grid-column: 2; grid-row: 1; }
.ea-service__cover img, .ea-contact__photo img { animation: ea-cover-reveal 1.2s cubic-bezier(.16, 1, .3, 1) .35s both; }
@keyframes ea-cover-reveal { from { clip-path: inset(0 0 100% 0); transform: scale(1.05); } to { clip-path: inset(0 0 0 0); transform: scale(1); } }

.ea-service__intro { min-height: calc(62svh - var(--site-header-height)); }
.ea-service h1 { max-width: 10ch; font-size: clamp(3.25rem, 6.8vw, 6.25rem); letter-spacing: -.035em; line-height: .95; }
.ea-service__brand { margin: clamp(1.5rem, 3vw, 2.25rem) 0 0; line-height: 0; }
.ea-service__brand .ea-logo { width: min(100%, 20rem); }
.ea-service__lede { max-width: 32rem; margin: clamp(1.5rem, 3vw, 2.25rem) 0 0; color: var(--ea-ink); font-size: clamp(1.125rem, 1.6vw, 1.375rem); line-height: 1.55; text-wrap: pretty; }
.ea-service__body { max-width: 34rem; margin-top: clamp(2.5rem, 5vw, 4rem); }
.ea-service__body p { margin: 0; color: var(--ea-muted); font-size: 1.0625rem; line-height: 1.72; text-wrap: pretty; }
.ea-service__body p + p { margin-top: 1.1em; }
.ea-service__facts { display: grid; max-width: 34rem; margin: clamp(2.25rem, 4vw, 3rem) 0 clamp(2.25rem, 4vw, 3rem); }
.ea-service__facts div { display: grid; grid-template-columns: 7rem minmax(0, 1fr); gap: 1rem; padding-block: .85rem; border-top: 1px solid var(--ea-line); }
.ea-service__facts div:last-child { border-bottom: 1px solid var(--ea-line); }
.ea-service__facts dt { color: var(--ea-muted); font-size: .8125rem; line-height: 1.55; }
.ea-service__facts dd { margin: 0; font-size: .9375rem; line-height: 1.55; }

/* Gallery: photos keep their own proportions in a quiet masonry. */
.ea-service__gallery { columns: 3; column-gap: clamp(.75rem, 1.6vw, 1.5rem); max-width: var(--ea-wide-width); margin: auto; padding: var(--ea-section-space) var(--ea-gutter) 0; scroll-margin-top: var(--site-header-height); }
.ea-service__photo { margin: 0 0 clamp(.75rem, 1.6vw, 1.5rem); break-inside: avoid; }
.ea-service__photo img { height: auto; }
.ea-service__photo video { display: block; width: 100%; height: auto; }

/* Next service. */
.ea-next { max-width: var(--ea-content-width); margin: auto; padding: var(--ea-section-space) var(--ea-gutter) 0; }
.ea-next__link { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: .75rem 2rem; padding-block: clamp(2rem, 4vw, 3rem); border-block: 1px solid var(--ea-line); color: inherit; text-decoration: none; }
.ea-next__title { font-family: var(--font-display); font-size: clamp(2.5rem, 6vw, 5.5rem); letter-spacing: -.035em; line-height: .98; transition: color 200ms ease; }
.ea-next__summary { grid-column: 1; color: var(--ea-muted); }
.ea-next__go { grid-column: 2; grid-row: 1 / span 2; display: grid; width: clamp(3.5rem, 6vw, 5rem); height: clamp(3.5rem, 6vw, 5rem); place-items: center; border: 1px solid var(--ea-line); border-radius: 50%; transition: background-color 200ms ease, color 200ms ease, border-color 200ms ease; }
.ea-next__link:hover .ea-next__title, .ea-next__link:focus-visible .ea-next__title { color: var(--ea-wine); }
.ea-next__link:hover .ea-next__go, .ea-next__link:focus-visible .ea-next__go { border-color: var(--ea-ink); background: var(--ea-ink); color: var(--ea-paper-light); }

/* Closing call. */
.ea-cta { padding: var(--ea-section-space) var(--ea-gutter); text-align: center; }
.ea-cta h2 { font-size: clamp(3rem, 7.5vw, 7rem); letter-spacing: -.04em; line-height: .95; }
.ea-cta p { max-width: 30rem; margin: 1.5rem auto 2.25rem; color: var(--ea-muted); line-height: 1.65; }
.ea-cta .ea-actions { justify-content: center; }

/* Contact. */
.ea-contact__photo { grid-column: 1; grid-row: 1; }
.ea-contact__content { grid-column: 2; grid-row: 1; padding: clamp(3rem, 7vh, 5.5rem) var(--ea-gutter) clamp(4rem, 9vw, 7rem) clamp(2rem, 5vw, 6rem); }
.ea-contact h1 { font-size: clamp(3.25rem, 6.8vw, 6rem); letter-spacing: -.035em; line-height: .95; }
.ea-contact__lede { max-width: 30rem; margin: 1.25rem 0 0; font-size: 1.0625rem; line-height: 1.6; }
.ea-contact__form { display: grid; grid-template-columns: 1fr 1fr; gap: 1.25rem; max-width: 36rem; margin-top: clamp(2rem, 4vw, 3rem); scroll-margin-top: calc(var(--site-header-height) + 1rem); }
.ea-field { display: grid; grid-column: 1 / -1; gap: .45rem; margin: 0; }
.ea-field--half { grid-column: span 1; }
.ea-field label { font-size: .8125rem; font-weight: 600; letter-spacing: .01em; }
.ea-field .ea-optional { color: var(--ea-muted); font-weight: 400; }
.ea-field input, .ea-field select, .ea-field textarea { width: 100%; padding: .95rem 1rem; border: 0; border-radius: 2px; background: var(--ea-paper-soft); color: var(--ea-ink); font-size: 1rem; line-height: 1.5; transition: background-color 160ms ease; }
.ea-field select { appearance: none; padding-right: 2.75rem; background-image: linear-gradient(45deg, transparent 50%, currentColor 50%), linear-gradient(135deg, currentColor 50%, transparent 50%); background-position: calc(100% - 1.35rem) 50%, calc(100% - 1rem) 50%; background-size: .35rem .35rem; background-repeat: no-repeat; cursor: pointer; }
.ea-field textarea { min-height: 9rem; resize: none; }
.ea-field input[type=number] { -moz-appearance: textfield; appearance: textfield; }
.ea-field input[type=number]::-webkit-outer-spin-button, .ea-field input[type=number]::-webkit-inner-spin-button { margin: 0; -webkit-appearance: none; }
.ea-field input:hover, .ea-field select:hover, .ea-field textarea:hover { background-color: #e4dfd4; }
.ea-field input:focus, .ea-field select:focus, .ea-field textarea:focus { outline: 2px solid var(--ea-wine); outline-offset: 0; background-color: var(--ea-paper-light); }
.ea-field__count { justify-self: end; color: var(--ea-muted); font-size: .75rem; font-variant-numeric: tabular-nums; }
.ea-hp { position: absolute; left: -9999px; }
.ea-contact__form .ea-btn { grid-column: 1 / -1; justify-self: start; margin-top: .5rem; }
.ea-contact__legal { grid-column: 1 / -1; margin: 0; color: var(--ea-muted); font-size: .8125rem; line-height: 1.55; }
.ea-contact__notice { max-width: 36rem; margin: clamp(2rem, 4vw, 3rem) 0 0; padding: 1.25rem 1.5rem; border-radius: 2px; background: var(--ea-paper-soft); font-size: 1.0625rem; line-height: 1.6; }
.ea-contact__notice p { margin: 0; }
.ea-contact__notice a { display: inline-block; margin-top: .5rem; font-size: .9375rem; text-decoration-color: var(--ea-wine); text-underline-offset: .3em; }
.ea-contact__notice + .ea-contact__form { margin-top: 1.5rem; }
/* Contact Form 7 pieces, styled by the theme (its own stylesheet is not loaded). */
.ea-contact .wpcf7 .screen-reader-response { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.ea-contact__form .hidden-fields-container { display: none; }
.ea-field .wpcf7-form-control-wrap { display: block; position: relative; }
.ea-field [aria-invalid="true"] { box-shadow: inset 0 -2px 0 var(--ea-wine); }
/* Error tips sit in the gap under their field and take no space: nothing shifts when they come and go
   (otherwise the button moves while it is being clicked and the click is lost). */
.ea-contact__form .wpcf7-not-valid-tip { position: absolute; top: calc(100% + .2rem); left: 0; color: var(--ea-wine); font-size: .75rem; font-weight: 600; line-height: 1.3; white-space: nowrap; }
/* The theme shows its own notice and confirmation; the plugin's box only appears if its script could not run. */
.ea-contact__form .wpcf7-response-output { display: none; }
.wpcf7.no-js .ea-contact__form .wpcf7-response-output:not(:empty) { display: block; grid-column: 1 / -1; margin: 0; padding: 1.25rem 1.5rem; border-radius: 2px; background: var(--ea-paper-soft); font-size: 1.0625rem; line-height: 1.6; }

/* Sending: the fields step back, a line runs along the button, then the form folds and the confirmation draws in. */
.ea-contact__form { transition: opacity 420ms var(--ea-ease), transform 420ms var(--ea-ease), filter 420ms ease; }
.ea-contact__form[hidden], .ea-sent[hidden] { display: none; }
.ea-contact__form.is-sending .ea-field, .ea-contact__form.is-sending .ea-contact__legal { opacity: .45; pointer-events: none; transition: opacity 240ms ease; }
.ea-contact__form.is-leaving { opacity: 0; transform: translateY(-1rem); filter: blur(4px); }
.ea-contact__form.is-collapsing { overflow: hidden; transition: height 520ms cubic-bezier(.76, 0, .24, 1); }
.ea-contact__form.is-returning { opacity: 0; transform: translateY(1rem); transition: none; }
.ea-submit { position: relative; overflow: hidden; min-width: 11.5rem; }
.ea-submit:disabled { cursor: progress; }
.ea-submit__progress { position: absolute; right: 0; bottom: 0; left: 0; height: 2px; background: var(--ea-wine); transform: scaleX(0); transform-origin: left; }
.ea-contact__form.is-sending .ea-submit, .ea-contact__form.is-sending .ea-submit:hover { background: var(--ea-ink); color: var(--ea-paper-light); }
.ea-contact__form.is-sending .ea-submit__progress { animation: ea-progress 1.1s cubic-bezier(.65, 0, .35, 1) infinite; }
@keyframes ea-progress { 0% { transform: scaleX(0); transform-origin: left; } 50% { transform: scaleX(1); transform-origin: left; } 50.01% { transform-origin: right; } 100% { transform: scaleX(0); transform-origin: right; } }

.ea-contact__notice--error.is-shaking { animation: ea-shake 420ms cubic-bezier(.36, .07, .19, .97); }
@keyframes ea-shake { 20%, 60% { transform: translateX(-6px); } 40%, 80% { transform: translateX(6px); } }

.ea-sent { display: grid; justify-items: start; gap: 1rem; max-width: 36rem; margin-top: clamp(2rem, 4vw, 3rem); padding: clamp(1.75rem, 3.5vw, 2.5rem); border-radius: 2px; background: var(--ea-paper-soft); }
.ea-sent__mark { width: 3.5rem; height: 3.5rem; fill: none; stroke: var(--ea-wine); stroke-linecap: round; stroke-linejoin: round; stroke-width: 2; }
.ea-sent__mark circle { stroke-dasharray: 190; stroke-dashoffset: 190; transform: rotate(-90deg); transform-origin: center; }
.ea-sent__mark path { stroke-dasharray: 40; stroke-dashoffset: 40; stroke-width: 2.5; }
.ea-sent.is-in .ea-sent__mark circle { stroke-dashoffset: 0; transition: stroke-dashoffset 700ms cubic-bezier(.65, 0, .35, 1); }
.ea-sent.is-in .ea-sent__mark path { stroke-dashoffset: 0; transition: stroke-dashoffset 420ms cubic-bezier(.65, 0, .35, 1) 560ms; }
.ea-sent__title { margin: .5rem 0 0; font-size: clamp(2rem, 3.4vw, 2.75rem); letter-spacing: -.025em; line-height: 1.05; outline: none; }
.ea-sent__text { max-width: 28rem; margin: 0 0 .75rem; font-size: 1.0625rem; line-height: 1.6; }
.ea-sent__title, .ea-sent__text, .ea-sent .ea-btn { opacity: 0; transform: translateY(.75rem); }
.ea-sent.is-in .ea-sent__title, .ea-sent.is-in .ea-sent__text, .ea-sent.is-in .ea-btn { opacity: 1; transform: translateY(0); transition: opacity 500ms ease, transform 600ms var(--ea-ease), background-color 160ms ease, color 160ms ease; }
.ea-sent.is-in .ea-sent__title { transition-delay: 700ms; }
.ea-sent.is-in .ea-sent__text { transition-delay: 800ms; }
.ea-sent.is-in .ea-btn { transition-delay: 900ms, 900ms, 0s, 0s; }

@media (prefers-reduced-motion: reduce) {
	.ea-contact__form, .ea-contact__form.is-collapsing, .ea-sent__mark *, .ea-sent__title, .ea-sent__text, .ea-sent .ea-btn { transition: none !important; }
	.ea-contact__form.is-sending .ea-submit__progress, .ea-contact__notice--error.is-shaking { animation: none; }
	.ea-sent__mark circle, .ea-sent__mark path { stroke-dashoffset: 0; }
	.ea-sent__title, .ea-sent__text, .ea-sent .ea-btn { opacity: 1; transform: none; }
}

.ea-contact__direct { display: grid; gap: .9rem; max-width: 36rem; margin: clamp(3rem, 6vw, 5rem) 0 0; }
.ea-contact__direct h2 { margin: 0 0 .35rem; font-size: clamp(1.5rem, 2.4vw, 2rem); letter-spacing: -.02em; line-height: 1.1; }
.ea-contact__direct dl { display: contents; }
.ea-contact__direct div { display: grid; grid-template-columns: 6.5rem minmax(0, 1fr); gap: 1rem; align-items: baseline; }
.ea-contact__direct dt { color: var(--ea-muted); font-size: .8125rem; }
.ea-contact__direct dd { margin: 0; font-size: 1.0625rem; overflow-wrap: anywhere; }
.ea-contact__direct a { text-decoration-color: var(--ea-wine); text-decoration-thickness: 1px; text-underline-offset: .3em; }

@media (max-width: 900px) {
	.ea-service__stage, .ea-contact__stage { grid-template-columns: minmax(0, 1fr); }
	.ea-service__cover, .ea-contact__photo { grid-column: 1; grid-row: 1; position: relative; top: auto; height: auto; min-height: 0; aspect-ratio: 4 / 3; }
	.ea-service__text, .ea-contact__content { grid-column: 1; grid-row: 2; padding: 2.75rem var(--ea-gutter) 1rem; }
	.ea-contact__content { padding-bottom: 4rem; }
	.ea-service__intro { min-height: 0; }
	.ea-service h1, .ea-contact h1 { max-width: none; font-size: clamp(3rem, 13vw, 4.5rem); }
	.ea-service__facts div, .ea-contact__direct div { grid-template-columns: 5.75rem minmax(0, 1fr); }
	.ea-service__gallery { columns: 2; padding-top: 3rem; }
	.ea-contact__form { grid-template-columns: 1fr; }
	.ea-field--half { grid-column: 1 / -1; }
}
@media (prefers-reduced-motion: reduce) { .ea-service__cover img, .ea-contact__photo img { animation: none; } .ea-field input, .ea-field select, .ea-field textarea, .ea-next__title, .ea-next__go { transition: none; } }