/* =========================================================================
   Contact page (+ the 404 page, which shares this stylesheet)
   ========================================================================= */

/* ---------- Hero: Visit 140 Route 59 ---------- */
.contact-hero { min-height: min(84vh, 900px); }
.contact-hero__media img { object-position: 50% 58%; }
.contact-hero__media::after {
  background:
    linear-gradient(180deg, rgba(10,9,8,.42) 0%, rgba(10,9,8,0) 28%),
    linear-gradient(0deg, rgba(10,9,8,.72) 0%, rgba(10,9,8,.28) 40%, rgba(10,9,8,0) 66%),
    linear-gradient(90deg, rgba(10,9,8,.3) 0%, rgba(10,9,8,0) 55%);
}
.contact-hero__content { padding-bottom: clamp(3rem, 6vw, 5.5rem); }
.contact-hero__eyebrow { display: flex; align-items: center; gap: .9rem; margin-bottom: clamp(1.1rem, 2.2vh, 1.8rem); }
.contact-hero__dot { width: .35rem; height: .35rem; transform: rotate(45deg); background: var(--blush); }
.contact-hero__title { font-size: clamp(3.4rem, 10.4vw, 11.5rem); line-height: .9; }
.contact-hero__title em { font-size: .74em; line-height: 1; color: var(--blush); display: inline-block; padding-left: .04em; }
.contact-hero__row {
  display: flex; align-items: flex-end; justify-content: space-between; gap: 2rem;
  margin-top: clamp(1.4rem, 3vh, 2.4rem); padding-top: clamp(1.2rem, 2.4vh, 1.8rem);
  border-top: 1px solid rgba(255,255,255,.28);
}
.contact-hero__address { font-style: normal; font-family: var(--f-display); font-style: italic; font-size: clamp(1.5rem, 2.4vw, 2.4rem); line-height: 1.1; color: rgba(255,255,255,.92); }
.contact-hero .link-arrow { color: #fff; }

/* intro choreography — plays when the curtain lifts */
.js .contact-hero__title .line__inner { transform: translate3d(0, 108%, 0); transition: transform 1.5s var(--ease-out); transition-delay: calc(.15s + var(--i, 0) * .12s); }
.js .contact-hero__eyebrow, .js .contact-hero__row { opacity: 0; transform: translateY(16px); transition: opacity 1.2s var(--ease-out) .6s, transform 1.4s var(--ease-out) .6s; }
.is-loaded .contact-hero__title .line__inner { transform: none; }
.is-loaded .contact-hero__eyebrow, .is-loaded .contact-hero__row { opacity: 1; transform: none; }
.is-loaded .contact-hero__eyebrow { transition-delay: .1s; }
.js .contact-hero__media img { transform: scale(1.08); transition: transform 2.8s var(--ease-out); }
.is-loaded .contact-hero__media img { transform: none; }

@media (max-width: 700px) {
  .contact-hero { min-height: 78svh; }
  .contact-hero__media img { object-position: 66% 58%; } /* keep the lit oak entrance tower in frame */
  .contact-hero__title { font-size: clamp(3rem, 16vw, 5rem); }
  .contact-hero__row { flex-direction: column; align-items: flex-start; gap: 1rem; }
}

/* ---------- Contact + inquiry split ---------- */
.contact__grid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: clamp(1rem, 2.2vw, 2.25rem); align-items: start; }
.contact__people { grid-column: 1 / span 5; }
.contact__title { margin-top: 1.4rem; font-size: clamp(2.9rem, 5.6vw, 5.8rem); }
.contact__lead { margin-top: 1.6rem; max-width: 26rem; }

.contact__cards { margin-top: clamp(3rem, 5vw, 4.5rem); border-top: 1px solid var(--line-strong); }
.contact-card { padding: clamp(1.8rem, 3vw, 2.4rem) 0; border-bottom: 1px solid var(--line); display: grid; gap: .55rem; justify-items: start; }
.contact-card__head { display: flex; align-items: baseline; gap: .8rem; margin-bottom: .5rem; }
.contact-card__head .index-num { font-size: 1.15rem; }
.contact-card__name { font-size: clamp(1.9rem, 2.6vw, 2.6rem); }
.contact-card__meta { font-size: .95rem; line-height: 1.6; color: var(--ink-2); max-width: 26rem; }
.contact-card__lines { display: grid; width: 100%; margin-top: 1rem; }
.contact-line {
  display: grid; grid-template-columns: 4.2rem 1fr auto; align-items: baseline; gap: 1rem;
  padding: .8rem 0; border-top: 1px solid var(--line); color: var(--ink);
}
.contact-line::after { content: "→"; font-size: .9rem; color: var(--stone); opacity: 0; transform: translateX(-6px); transition: opacity .5s var(--ease-out), transform .6s var(--ease-out); }
.contact-line:hover::after, .contact-line:focus-visible::after { opacity: 1; transform: none; color: var(--brass); }
.contact-line__k { font-size: .68rem; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; color: var(--stone); }
.contact-line__v { font-family: var(--f-display); font-size: clamp(1.25rem, 1.6vw, 1.55rem); line-height: 1.2; overflow-wrap: anywhere; background: linear-gradient(currentColor, currentColor) 0 100% / 0 1px no-repeat; transition: background-size .6s var(--ease-out); justify-self: start; }
.contact-line:hover .contact-line__v, .contact-line:focus-visible .contact-line__v { background-size: 100% 1px; }
.contact-card__cta { margin-top: .9rem; }

.contact__form-col { grid-column: 7 / span 6; }
/* sticky only where the whole panel fits on screen — otherwise the button would sit below the fold */
@media (min-width: 1001px) and (min-height: 980px) {
  .contact__form-col { position: sticky; top: calc(var(--header-h-sm) + 2rem); }
}

/* the lobby, wide and quiet, between the conversation and the journey */
.contact__still { margin-top: clamp(5.5rem, 10vw, 9.5rem); }
.contact__still .media { aspect-ratio: 21 / 9; }
.contact__still img { object-position: 50% 62%; }

/* the form sits on a quiet paper panel — the one "box" on the page */
.inquiry { background: var(--paper); padding: clamp(2rem, 4vw, 4rem); box-shadow: 0 40px 90px -60px rgba(60, 40, 20, .35); position: relative; }
.inquiry::before { content: ""; position: absolute; left: clamp(2rem, 4vw, 4rem); top: 0; width: 3.5rem; height: 2px; background: var(--blush); }
.inquiry__head { display: grid; gap: 1rem; }
.inquiry__title { font-size: clamp(2.4rem, 3.8vw, 3.9rem); }

.inquiry__regarding { margin-top: 1.6rem; }
.inquiry__chip { gap: .7rem; padding-right: .35rem; cursor: default; }
.inquiry__chip-x { position: relative; width: 1.9rem; height: 1.9rem; display: grid; place-items: center; color: inherit; border-left: 1px solid rgba(255,255,255,.25); margin-left: .2rem; transition: opacity .3s; }
.inquiry__chip-x::after { content: ""; position: absolute; inset: -.45rem -.45rem -.45rem -.2rem; } /* 44px touch target */
.inquiry__chip-x:hover { opacity: .7; }
.inquiry__chip-x:focus-visible { outline-color: var(--blush); outline-offset: 1px; }

.inquiry__form { margin-top: clamp(2rem, 3.5vw, 3rem); }
.inquiry__fields { display: grid; grid-template-columns: 1fr 1fr; column-gap: clamp(1.4rem, 2.6vw, 2.6rem); row-gap: 2.6rem; align-items: end; /* a wrapped label never knocks paired underlines out of line */ }
.inquiry__fields .field--full { grid-column: 1 / -1; }
.inquiry .field label .req { color: var(--blush-2); }
.inquiry .field__error { position: absolute; left: 0; top: calc(100% + .35rem); line-height: 1.3; }
.inquiry .field__error:empty { display: none; }
.inquiry .select { color: var(--ink); }
.inquiry .select.is-empty { color: var(--stone); }
.inquiry .select option { color: var(--ink); }
.inquiry .textarea { min-height: 6.5rem; }
.inquiry .input::placeholder, .inquiry .textarea::placeholder { color: var(--stone); opacity: .85; }

.inquiry__hp { position: absolute !important; left: -10000px; width: 1px; height: 1px; overflow: hidden; }

.inquiry__foot { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem 2rem; margin-top: 2.6rem; flex-wrap: wrap; }
.inquiry__note { max-width: 20rem; line-height: 1.5; font-size: .8rem; }
.inquiry__submit { min-width: 15rem; }
.inquiry__submit.is-busy { pointer-events: none; }
.inquiry__submit.is-busy .arrow { animation: nudge 1s var(--ease-in-out) infinite; }
@keyframes nudge { 50% { transform: translateX(6px); } }
.inquiry__status { margin-top: 1.2rem; font-size: .9rem; line-height: 1.5; color: #9e3d31; }
.inquiry__status:empty { display: none; }
.inquiry__status a { text-decoration: underline; text-underline-offset: 3px; }

/* success */
.inquiry__done { display: grid; gap: 1.2rem; justify-items: start; padding-block: clamp(.5rem, 2vw, 1.5rem) .5rem; outline: none; }
.inquiry__done-title { font-size: clamp(2.8rem, 5vw, 5rem); outline: none; }
.inquiry__done-text { max-width: 30rem; }
.inquiry__done-alt { max-width: 30rem; line-height: 1.6; }
.inquiry__done-alt a { color: var(--ink); }
.inquiry__done-actions { display: flex; flex-wrap: wrap; gap: 1rem 2.4rem; margin-top: 1.4rem; }
.motion-ok .inquiry__done > * { animation: done-in 1.1s var(--ease-out) both; }
.motion-ok .inquiry__done > :nth-child(2) { animation-delay: .08s; }
.motion-ok .inquiry__done > :nth-child(3) { animation-delay: .16s; }
.motion-ok .inquiry__done > :nth-child(n+4) { animation-delay: .24s; }
@keyframes done-in { from { opacity: 0; transform: translateY(18px); } }

@media (max-width: 1000px) {
  .contact__people, .contact__form-col { grid-column: 1 / -1; }
  .contact__form-col { margin-top: clamp(3.5rem, 8vw, 5rem); }
  .contact__still .media { aspect-ratio: 16 / 10; }
}
@media (max-width: 640px) {
  .inquiry { padding: 2.6rem var(--gutter) 2.4rem; margin-inline: calc(var(--gutter) * -1); box-shadow: none; }
  .inquiry::before { left: var(--gutter); }
  .inquiry__fields { grid-template-columns: 1fr; row-gap: 2rem; }
  .inquiry__submit { width: 100%; min-width: 0; }
  .contact-line { grid-template-columns: 3.6rem 1fr; }
  .contact-line::after { display: none; }
  .contact__still { margin-top: 0; padding-inline: 0; }
  .contact__still .media { aspect-ratio: 4 / 3; }
  .contact__still img { object-position: 38% 60%; }
  .contact__still .caption { padding-inline: var(--gutter); }
}

/* ---------- Arrival ---------- */
.arrival__head { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: clamp(1rem, 2.2vw, 2.25rem); align-items: end; }
.arrival__head > div:first-child { grid-column: 1 / span 7; }
.arrival__title { margin-top: 1.4rem; font-size: clamp(3.4rem, 9vw, 9.4rem); }
.arrival__intro { grid-column: 9 / span 4; display: grid; gap: 1rem; justify-items: start; }
.arrival__address { font-style: normal; font-family: var(--f-display); font-size: clamp(1.7rem, 2.4vw, 2.3rem); line-height: 1.1; color: var(--ink); margin-bottom: .8rem; }
.arrival__dirs { display: flex; flex-wrap: wrap; gap: .6rem; }
.arrival__dir { min-height: 2.9rem; padding: 0 1.15rem; font-size: .66rem; }

.arrival__map { margin-top: clamp(3rem, 5vw, 4.5rem); grid-template-columns: minmax(0, 1fr); }
.arrival__map .locmap__bar, .arrival__map .locmap__filters { min-width: 0; }
.arrival__map .locmap__canvas { min-height: clamp(22rem, 52vh, 36rem); }
.arrival__map .locmap__stage { grid-column: 1 / -1; }

.arrival__notes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: clamp(1.5rem, 3vw, 3rem); margin-top: clamp(3rem, 5vw, 4.5rem); }
.arrival__note { display: grid; grid-template-columns: 2.6rem 1fr; column-gap: .6rem; row-gap: .6rem; padding-top: 1.6rem; border-top: 1px solid var(--line-strong); align-content: start; }
.arrival__note .index-num { grid-row: span 2; font-size: 1.3rem; line-height: 1.2; }
.arrival__note p { color: var(--ink-2); max-width: 22rem; line-height: 1.6; }
@media (max-width: 900px) {
  .arrival__head > div:first-child, .arrival__intro { grid-column: 1 / -1; }
  .arrival__intro { margin-top: 2rem; }
  .arrival__notes { grid-template-columns: 1fr; row-gap: 2rem; }
  .arrival__map .locmap__canvas { min-height: 22rem; }
}
@media (max-width: 520px) {
  .arrival__dirs { width: 100%; display: grid; grid-template-columns: 1fr 1fr 1fr; gap: .4rem; }
  .arrival__dir { padding: 0 .4rem; letter-spacing: .12em; }
}

/* ---------- 404 ---------- */
.lost { min-height: 100vh; min-height: 100svh; display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: clamp(1rem, 2.2vw, 2.25rem); align-items: stretch; }
.lost__text { grid-column: 1 / span 6; padding: calc(var(--header-h) + clamp(3rem, 8vh, 6rem)) 0 clamp(3rem, 8vh, 6rem) var(--gutter); display: flex; flex-direction: column; justify-content: center; }
.lost__code { font-family: var(--f-display); font-style: italic; color: var(--brass); font-size: clamp(1.2rem, 1.6vw, 1.5rem); display: flex; align-items: center; gap: 1rem; }
.lost__code::after { content: ""; width: 3rem; height: 1px; background: currentColor; opacity: .6; }
.lost__title { margin-top: 1.6rem; font-size: clamp(3.6rem, 9.4vw, 10rem); line-height: .88; }
.lost__sub { margin-top: 2rem; max-width: 28rem; }
.lost__links { margin-top: clamp(2.4rem, 5vh, 3.6rem); max-width: 30rem; border-top: 1px solid var(--line-strong); }
.lost__links a { display: grid; grid-template-columns: 2.4rem 1fr auto; align-items: baseline; gap: .6rem; padding: 1.05rem 0; border-bottom: 1px solid var(--line); color: var(--ink); }
.lost__links .h4 { font-size: clamp(1.5rem, 2vw, 1.9rem); transition: transform .6s var(--ease-out); }
.lost__links .arrow { align-self: center; transition: transform .6s var(--ease-out); color: var(--stone); }
.lost__links a:hover .h4, .lost__links a:focus-visible .h4 { transform: translateX(6px); }
.lost__links a:hover .arrow, .lost__links a:focus-visible .arrow { transform: translateX(4px); color: var(--brass); }
.lost__media { grid-column: 8 / -1; position: relative; min-height: 32rem; margin: 0; }
.lost__media .media { position: absolute; top: calc(var(--header-h) + 1rem); right: var(--gutter); bottom: 4.2rem; left: 0; }
.lost__media figcaption { position: absolute; left: 0; bottom: 1.6rem; margin: 0; }
@media (max-width: 900px) {
  .lost { min-height: 0; }
  .lost__text { grid-column: 1 / -1; padding-right: var(--gutter); }
  .lost__media { grid-column: 1 / -1; min-height: 0; padding: 0 var(--gutter) 3.6rem; }
  .lost__media .media { position: relative; inset: auto; aspect-ratio: 4 / 3; }
  .lost__media figcaption { left: var(--gutter); bottom: 1.2rem; }
}
.qa .lost { min-height: 900px; }
