/* A waterfront invitation, followed by the studio's contact details. */
.contact.contact-finale,
.book-chapter.book-ready + .contact.contact-finale {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background: #e8e8e2;
  color: #222820;
  border: 0;
  text-align: left;
  min-height: max(780px, 100svh);
  scroll-margin-top: -90px;
  padding-block: clamp(124px, 14svh, 166px) 54px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
.contact-landscape {position: absolute; inset: 0; z-index: -2; overflow: hidden; pointer-events: none;}
.contact-landscape img {display: block; width: 100%; height: 100%; object-fit: cover; object-position: 50% 42%;}
.contact-finale::before {
  content: ''; position: absolute; inset: 0; z-index: -1; pointer-events: none;
  background: linear-gradient(180deg, #f1f1eb30 0%, #f1f1eb08 37%, transparent 54%, #08130a12 58%, #020703b8 78%, #000 100%);
}
.contact-frame {position: relative; display: flex; flex: 1; flex-direction: column; justify-content: space-between; gap: clamp(220px, 30svh, 380px); width: 100%; max-width: 1640px; margin-inline: auto;}
.contact-question {align-self: flex-start;}
.contact-finale .contact-title {
  max-width: none; margin: 0;
  font-size: clamp(48px, 3.8vw, 72px);
  font-weight: 400; letter-spacing: -.045em; line-height: 1.055;
  text-wrap: initial;
}
.contact-finale .contact-title .contact-line {display: block; overflow: hidden; padding-bottom: .1em; margin-bottom: -.1em; color: #222820;}
.contact-finale .contact-title .contact-line > span {display: block; color: inherit;}
.contact-finale .contact-title .contact-emphasis {display: inline; color: #df2b23; font-size: 1.12em; font-weight: 500;}
.contact-finale .contact-title .red-period {color: #df2b23;}
.contact-landing {display: flex; justify-content: flex-end; color: #fff;}
.contact-finale .contact-actions {display: block; width: 55%; margin: 0; min-width: 300px;}
.contact-finale .contact-button {
  position: relative; display: flex; width: 100%; min-height: 92px;
  padding: 16px 0; justify-content: space-between; align-items: center; gap: 24px;
  border: 0; border-top: 1px solid #ffffff55; border-bottom: 1px solid #ffffff55; border-radius: 0;
  color: #fff; background: transparent; font-size: clamp(23px, 2.05vw, 32px);
  font-weight: 400; letter-spacing: -.035em; transform: none;
}
.contact-finale .contact-button::after {content: ''; position: absolute; left: 0; right: 0; bottom: -1px; height: 1px; background: var(--red); transform: scaleX(0); transform-origin: left; transition: transform .6s var(--ease);}
.contact-finale .contact-button .button-arrow {width: 56px; height: 56px; flex-shrink: 0; background: transparent; border: 1px solid #ffffff66; color: #fff; font-size: 28px; font-weight: 300;}
.contact-finale .contact-button:hover,.contact-finale .contact-button:focus-visible {background: transparent; color: #fff; border-color: #ffffff80; transform: none;}
.contact-finale .contact-button:hover::after,.contact-finale .contact-button:focus-visible::after {transform: scaleX(1);}
.contact-finale .contact-button:hover .button-arrow,.contact-finale .contact-button:focus-visible .button-arrow {background: var(--red); border-color: var(--red); transform: rotate(45deg);}
.contact-finale .contact-button:focus-visible {outline-color: #fff; outline-offset: 8px;}
.footer.site-footer {display: block; padding-block: 24px 38px; border: 0; background: #000; color: #f4f4f4;}
.footer-contact {display: grid; grid-template-columns: 1fr 55%; align-items: center; gap: 40px; padding-bottom: 64px;}
.site-footer .contact-portrait {display: flex; align-items: center; gap: 24px; width: auto; max-width: none; min-width: 0; margin: 0;}
.portrait-window {width: 112px; flex: 0 0 112px; overflow: hidden; background: #151515;}
.site-footer .contact-portrait img {display: block; width: 100%; height: auto; aspect-ratio: 1; object-fit: cover; border-radius: 0;}
.contact-portrait figcaption {margin: 0; color: #fff; font-size: 24px; line-height: 1.3; letter-spacing: -.035em;}
.contact-portrait figcaption span {display: block; color: #b2b2b2; font-size: 14px; line-height: 1.5; letter-spacing: 0;}
.contact-portrait .contact-role {margin-top: 8px; color: #ececec;}
.contact-details {margin: 0; min-width: 0; font-style: normal;}
.contact-details a {display: inline-flex; align-items: center; gap: 24px; padding-block: 12px; font-size: clamp(20px, 2.05vw, 30px); letter-spacing: -.035em; transition: color .25s;}
.contact-details a span {color: var(--red); transition: transform .3s var(--ease);}
.contact-details a:hover,.contact-details a:focus-visible {color: var(--red);}
.contact-details a:hover span {transform: translate(3px, -3px);}
.footer-bottom {display: flex; align-items: flex-end; justify-content: space-between; gap: 32px; padding-top: 28px; border-top: 1px solid #ffffff24;}
.footer-signature {font-size: clamp(23px, 2.3vw, 36px); line-height: 1.05; letter-spacing: -.045em; font-weight: 500;}
.footer-right {display: flex; flex-direction: column; align-items: flex-end; gap: 22px;}
.contact-socials {display: flex; gap: 30px; align-items: center; font-size: 14px;}
.contact-socials a {display: inline-flex; align-items: center; gap: 12px; min-height: 32px; color: #c3c3c3; transition: color .25s;}
.contact-socials a:hover {color: #fff;}
.contact-socials a span {display: inline-block; transition: transform .3s var(--ease);}
.contact-socials a:hover span {transform: translate(2px, -2px);}
.footer-copyright {font-size: 12px; color: #848484;}
.nav.in-contact {color: #222820; background: #eff0e9b8; backdrop-filter: blur(18px); box-shadow: none;}
.nav.in-contact .nav-contact {color: #222820; background: #ffffff30; border-color: #22282035;}
.nav.in-contact .nav-contact:hover {color: #df2b23; border-color: #22282070;}
@media (max-width: 760px) {
  .contact.contact-finale,.book-chapter.book-ready + .contact.contact-finale {min-height: max(660px, 100svh); padding-block: 100px 32px;}
  .contact-frame {gap: clamp(160px, 27svh, 230px);}
  .contact-landscape img {object-position: 50% 43%;}
  .contact-finale .contact-title {font-size: clamp(40px, 10.8vw, 68px); line-height: 1.075; letter-spacing: -.045em;}
  .contact-finale .contact-actions {width: 100%; min-width: 0;}
  .footer-contact {grid-template-columns: 1fr; gap: 20px; padding-bottom: 36px;}
  .site-footer .contact-portrait {gap: 22px;}
  .portrait-window {width: 96px; flex-basis: 96px;}
  .contact-portrait figcaption {font-size: 22px;}
  .contact-portrait .contact-role {margin-top: 6px;}
  .contact-details a {font-size: 22px; gap: 20px;}
  .contact-finale .contact-button {min-height: 76px; font-size: 23px; padding-block: 12px; gap: 16px;}
  .contact-finale .contact-button .button-arrow {width: 48px; height: 48px; font-size: 25px;}
  .footer.site-footer {padding-block: 18px 28px;}
  .footer-bottom {gap: 20px; padding-top: 24px;}
  .footer-signature {font-size: 23px;}
  .footer-right {gap: 15px;}
  .contact-socials {gap: 18px; font-size: 14px;}
  .contact-socials a {gap: 5px;}
}
@media (max-width: 360px) {
  .contact-finale .contact-title {font-size: 11vw;}
  .contact-finale .contact-button {font-size: 21px;}
  .footer-bottom {align-items: flex-start; flex-direction: column;}
  .contact-details a {font-size: 20px;}
  .footer-right {align-items: flex-start;}
}
html[data-motion="reduced"] .contact-finale *,html[data-motion="reduced"] .contact-finale *::after,html[data-motion="reduced"] .site-footer * {transition: none;}
