/* ========================================================================
   ZAZA v40 — CONTACT / ONE LINE BETWEEN TWO PEOPLE
   ======================================================================== */
body.contact-page{--c-bg:#080808;--c-fg:#f1eee8;--c-muted:rgba(241,238,232,.52);--c-line:rgba(241,238,232,.18);background:var(--c-bg);color:var(--c-fg)}
.contact-page main{overflow:visible}.contact-page .global-stage{background:#080808}.contact-page .page-hero,.contact-page .contact-openline,.contact-page .contact-compose,.contact-page .contact-success{display:none!important}
.contact-page .site-header{color:#f1eee8;transition:color .35s ease}.contact-page.is-on-paper .site-header{color:#080808}.contact-page.is-on-paper .brand__mark{stroke:#080808}.contact-page .site-header__edge,.contact-page .scene-readout,.contact-page .render-readout{color:currentColor}

.contact-v40-hero{height:190svh;position:relative;background:#080808;color:#f1eee8}
.contact-v40-hero__sticky{position:sticky;top:0;height:100svh;overflow:hidden;padding:calc(var(--header-h) + 5vh) var(--pad) 8vh;display:grid;grid-template-rows:auto 1fr auto;isolation:isolate}
.contact-v40-hero__sticky::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at var(--hero-x,72%) var(--hero-y,44%),rgba(255,255,255,.055),transparent 30%);pointer-events:none;z-index:-1}
.contact-v40-hero__top,.contact-v40-hero__bottom{display:flex;align-items:center;justify-content:space-between;gap:20px;font:500 clamp(9px,.65vw,12px)/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.15em;text-transform:uppercase;color:rgba(241,238,232,.5)}
.contact-v40-hero__bottom{border-top:1px solid rgba(241,238,232,.14);padding-top:14px}
.contact-v40-hero__copy{align-self:center;position:relative;height:min(48vw,650px);display:flex;align-items:center;gap:2.7vw;white-space:nowrap;transform:translate3d(0,var(--hero-copy-y,0),0)}
.contact-v40-hero__copy>span{display:block;font-size:clamp(116px,20vw,360px);font-weight:620;letter-spacing:-.105em;line-height:.68;will-change:transform,opacity}
.contact-v40-hero__say{transform:translate3d(var(--say-x,0),0,0);opacity:var(--say-o,1)}
.contact-v40-hero__hi{transform:translate3d(var(--hi-x,0),0,0) scale(var(--hi-s,1));transform-origin:left center;opacity:var(--hi-o,1)}
.contact-v40-hero__aside{position:absolute;right:var(--pad);top:auto;bottom:16vh;width:min(30vw,420px);margin:0;font-size:clamp(18px,1.45vw,27px);line-height:1.06;letter-spacing:-.035em;color:rgba(241,238,232,.62);opacity:var(--hero-aside-o,1);transform:translate3d(0,var(--hero-aside-y,0),0)}
.contact-v40-hero__thought{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%) scale(var(--hero-thought-s,.92));font-size:clamp(54px,8.7vw,166px);font-weight:610;letter-spacing:-.082em;line-height:.8;text-align:center;white-space:nowrap;opacity:var(--hero-thought-o,0);pointer-events:none}

.contact-bridge{height:320svh;position:relative;background:#080808;color:#f1eee8}
.contact-bridge__sticky{position:sticky;top:0;height:100svh;overflow:hidden;padding:10vh var(--pad);isolation:isolate}
.contact-bridge__label{position:absolute;left:var(--pad);top:9vh;font:500 clamp(9px,.65vw,12px)/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.15em;color:rgba(241,238,232,.5)}
.contact-bridge__point{position:absolute;top:62%;transform:translate3d(var(--point-x,0),-50%,0);display:grid;gap:8px;z-index:3;will-change:transform}
.contact-bridge__point small{font:500 clamp(9px,.63vw,11px)/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.14em;color:rgba(241,238,232,.42)}
.contact-bridge__point strong{font-size:clamp(64px,9vw,170px);letter-spacing:-.085em;line-height:.78;font-weight:610}
.contact-bridge__point--you{left:var(--pad)}.contact-bridge__point--me{right:var(--pad);text-align:right}
.contact-bridge__line{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none;z-index:1}.contact-bridge__line path{fill:none;stroke:#f1eee8;stroke-width:1.2;vector-effect:non-scaling-stroke;opacity:.72}
.contact-bridge__conversation{position:absolute;left:50%;top:17vh;transform:translateX(-50%);width:min(64vw,980px);height:30vh;pointer-events:none;z-index:2}
.contact-bridge__conversation p{position:absolute;inset:0;margin:0;display:grid;place-items:center;text-align:center;font-size:clamp(54px,7.8vw,148px);line-height:.73;letter-spacing:-.088em;font-weight:610;opacity:0;transform:translate3d(0,28px,0) scale(.97);filter:blur(8px)}
.contact-bridge__hint{position:absolute;right:var(--pad);bottom:8vh;font:500 clamp(9px,.63vw,11px)/1 ui-monospace,monospace;letter-spacing:.14em;color:rgba(241,238,232,.38)}

.contact-letter-wrap{position:relative;background:#080808;padding:12vh 2.5vw 18vh}
.contact-letter{position:relative;min-height:120svh;background:#f0ede7;color:#080808;padding:7vh clamp(24px,5vw,88px) 10vh;overflow:hidden;box-shadow:0 50px 160px rgba(0,0,0,.45)}
.contact-letter::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent 0 7.5%,rgba(8,8,8,.055) 7.55%,transparent 7.6%);pointer-events:none}
.contact-letter__head{display:flex;justify-content:space-between;gap:24px;padding-bottom:14px;border-bottom:1px solid rgba(8,8,8,.18);font:600 clamp(9px,.66vw,12px)/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.14em;text-transform:uppercase;color:rgba(8,8,8,.52)}
.contact-letter h2{margin:8vh 0 3vh;font-size:clamp(86px,13vw,238px);font-weight:620;letter-spacing:-.095em;line-height:.69;max-width:8ch}
.contact-letter__intro{margin:0 0 10vh auto;width:min(42vw,610px);font-size:clamp(21px,1.8vw,34px);line-height:1.05;letter-spacing:-.04em;color:rgba(8,8,8,.58)}
.contact-message{position:relative;display:grid;gap:2.8vh}
.contact-message__line{display:flex;align-items:baseline;gap:.2em;flex-wrap:wrap;font-size:clamp(42px,6.3vw,118px);font-weight:590;line-height:.9;letter-spacing:-.068em}
.contact-message label{display:inline-flex;min-width:0;flex:1 1 340px}.contact-message input,.contact-message textarea{width:100%;border:0;border-bottom:2px solid rgba(8,8,8,.22);background:transparent;color:#080808;border-radius:0;outline:0;font:inherit;letter-spacing:inherit;line-height:inherit;padding:0 .06em .06em;transition:border-color .2s ease,transform .25s cubic-bezier(.16,1,.3,1)}
.contact-message input::placeholder,.contact-message textarea::placeholder{color:rgba(8,8,8,.18)}.contact-message input:focus,.contact-message textarea:focus{border-color:#080808;transform:translateY(-2px)}
.contact-message [aria-invalid="true"]{border-color:#a8261b!important}.contact-message__message{display:grid;gap:1.5vh;margin-top:4vh;font-size:clamp(42px,6.3vw,118px);font-weight:590;line-height:.9;letter-spacing:-.068em}.contact-message__message label{display:block}.contact-message textarea{height:2.05em;resize:none;overflow:hidden}
.contact-message__footer{display:flex;justify-content:space-between;align-items:flex-end;gap:40px;margin-top:6vh;padding-top:24px;border-top:1px solid rgba(8,8,8,.18)}.contact-message__footer p{margin:0;max-width:470px;font-size:clamp(15px,1vw,18px);line-height:1.28;color:rgba(8,8,8,.52)}
.contact-send{width:clamp(126px,10vw,180px);aspect-ratio:1;border-radius:50%;border:1px solid rgba(8,8,8,.26);background:#080808;color:#f0ede7;display:grid;place-items:center;position:relative;font:600 10px/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.14em;transition:transform .55s cubic-bezier(.16,1,.3,1),border-radius .55s cubic-bezier(.16,1,.3,1)}.contact-send i{position:absolute;right:24%;top:23%;font-style:normal;font-size:18px}.contact-send:hover{transform:scale(1.07) rotate(4deg);border-radius:42% 58% 52% 48%/54% 43% 57% 46%}
.contact-message__status{min-height:1.3em;margin:0;font:600 10px/1.3 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.1em;text-transform:uppercase;color:#a8261b}
.contact-letter__scribble{position:absolute;right:-2vw;top:8vh;width:min(25vw,400px);opacity:.12;transform:rotate(-8deg)}.contact-letter__scribble svg{width:100%;fill:none;stroke:#080808;stroke-width:2;stroke-linecap:round}

.contact-direct{min-height:115svh;background:#080808;color:#f1eee8;padding:12vh var(--pad) 14vh;display:flex;flex-direction:column;justify-content:center;overflow:hidden}
.contact-direct__top{display:flex;justify-content:space-between;gap:20px;margin-bottom:auto;font:500 clamp(9px,.65vw,12px)/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.15em;color:rgba(241,238,232,.46)}
.contact-direct__lead{margin:10vh 0 1vh;font-size:clamp(24px,2vw,38px);letter-spacing:-.04em;color:rgba(241,238,232,.54)}
.contact-email{border:0;background:none;color:#f1eee8;padding:0;text-align:left;display:grid;gap:1.8vh;width:100%;cursor:pointer}
.contact-email>span{font-size:clamp(54px,9.6vw,180px);font-weight:610;line-height:.77;letter-spacing:-.085em;overflow-wrap:anywhere;transition:font-variation-settings .2s ease,letter-spacing .45s cubic-bezier(.16,1,.3,1),transform .45s cubic-bezier(.16,1,.3,1)}.contact-email:hover>span{letter-spacing:-.065em;transform:translateX(1vw)}
.contact-email small{font:500 clamp(9px,.65vw,12px)/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.15em;color:rgba(241,238,232,.42)}
.contact-direct__links{margin-top:auto;padding-top:10vh;display:grid;border-top:1px solid rgba(241,238,232,.15)}.contact-direct__links a{display:flex;justify-content:space-between;align-items:center;padding:18px 0;border-bottom:1px solid rgba(241,238,232,.15);font-size:clamp(28px,3.5vw,64px);line-height:.9;letter-spacing:-.055em;transition:padding .45s cubic-bezier(.16,1,.3,1),opacity .25s ease}.contact-direct__links a i{font-style:normal;font-size:.55em}.contact-direct__links:hover a:not(:hover){opacity:.28}.contact-direct__links a:hover{padding-left:2vw;padding-right:2vw}

.contact-close{min-height:110svh;position:relative;background:#080808;color:#f1eee8;padding:12vh var(--pad) 9vh;display:flex;flex-direction:column;justify-content:center;overflow:hidden}
.contact-close__line{position:absolute;top:0;left:50%;height:100%;width:1px;background:rgba(241,238,232,.18);transform-origin:top;transform:scaleY(var(--close-line,0))}
.contact-close__copy{position:relative;z-index:1}.contact-close__copy>span{display:block;margin-bottom:4vh;font:500 clamp(10px,.72vw,13px)/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.15em;color:rgba(241,238,232,.5)}.contact-close__copy strong{display:block;font-size:clamp(88px,13.2vw,240px);line-height:.76;letter-spacing:-.095em;font-weight:620;max-width:7ch}
.contact-close__work{align-self:flex-end;margin-top:9vh;border-bottom:1px solid currentColor;padding-bottom:7px;font:600 clamp(10px,.72vw,13px)/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.13em}
.contact-footer{border-top:0!important;background:#080808;color:#f1eee8}

@media(max-width:980px){
  .contact-v40-hero__aside{right:var(--pad);bottom:16vh;width:min(48vw,460px)}
  .contact-v40-hero__copy{height:45vh}.contact-v40-hero__copy>span{font-size:clamp(100px,19vw,230px)}
  .contact-bridge__conversation{width:76vw;top:18vh}.contact-bridge__point strong{font-size:11vw}
  .contact-letter{padding-inline:5vw}.contact-letter h2{font-size:16vw}.contact-letter__intro{width:58vw}.contact-message__line,.contact-message__message{font-size:7.5vw}
}
@media(max-width:700px){
  .contact-v40-hero{height:160svh}.contact-v40-hero__sticky{padding-inline:18px;padding-bottom:9vh}.contact-v40-hero__top,.contact-v40-hero__bottom{font-size:8px;line-height:1.35}.contact-v40-hero__bottom{align-items:flex-end}.contact-v40-hero__bottom span:last-child{text-align:right;max-width:18ch}
  .contact-v40-hero__copy{height:42vh;display:block;align-self:center}.contact-v40-hero__copy>span{position:absolute;left:0;font-size:27vw;line-height:.72}.contact-v40-hero__say{top:8%}.contact-v40-hero__hi{top:47%}.contact-v40-hero__aside{left:18px;right:auto;bottom:17vh;width:72vw;font-size:18px}.contact-v40-hero__thought{font-size:15vw;white-space:normal;width:88vw}
  .contact-bridge{height:250svh}.contact-bridge__sticky{padding-inline:18px}.contact-bridge__label{left:18px}.contact-bridge__point--you{left:18px}.contact-bridge__point--me{right:18px}.contact-bridge__point strong{font-size:15vw}.contact-bridge__point small{font-size:8px}.contact-bridge__conversation{width:90vw;top:17vh}.contact-bridge__conversation p{font-size:16vw}.contact-bridge__hint{right:18px;font-size:8px}
  .contact-letter-wrap{padding:7vh 10px 10vh}.contact-letter{min-height:auto;padding:5vh 20px 8vh}.contact-letter__head{font-size:8px;align-items:flex-start}.contact-letter__head span:last-child{text-align:right}.contact-letter h2{margin-top:9vh;font-size:22vw}.contact-letter__intro{width:82%;font-size:19px;margin-bottom:8vh}.contact-letter__scribble{width:44vw;top:8vh}
  .contact-message{gap:4vh}.contact-message__line,.contact-message__message{font-size:11.3vw;line-height:.92}.contact-message label{flex-basis:100%}.contact-message input,.contact-message textarea{padding-left:0}.contact-message textarea{height:3.1em}.contact-message__footer{align-items:flex-start;flex-direction:column}.contact-send{align-self:flex-end;width:118px}
  .contact-direct{padding:10vh 18px 12vh;min-height:100svh}.contact-direct__top{font-size:8px}.contact-direct__lead{font-size:18px}.contact-email>span{font-size:10.6vw;line-height:.86}.contact-email small{font-size:8px}.contact-direct__links a{font-size:9.5vw}
  .contact-close{min-height:95svh;padding:10vh 18px}.contact-close__copy strong{font-size:21vw}.contact-close__work{align-self:flex-start;font-size:9px}
}
@media(prefers-reduced-motion:reduce){.contact-v40-hero__sticky::before{display:none}.contact-send,.contact-email>span,.contact-direct__links a{transition:none!important}}


/* ========================================================================
   v42 — selected message-echo interaction only
   ======================================================================== */
/* Give DON'T OVERTHINK IT a real hold instead of a fast transition beat. */
.contact-v40-hero{height:225svh}

/* Literal words from the visitor's message escape into the paper background. */
.contact-letter{isolation:isolate}
.contact-letter__echoes{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:0}
.contact-letter__echoes span{position:absolute;left:var(--echo-x);top:var(--echo-y);font-size:var(--echo-size);line-height:.72;font-weight:650;letter-spacing:-.075em;color:rgba(8,8,8,.038);white-space:nowrap;transform:translate(-50%,-50%) rotate(var(--echo-r)) scale(.94);opacity:0;animation:contactEchoIn .7s cubic-bezier(.16,1,.3,1) forwards;font-style:normal}
.contact-letter__echoes span i{display:block;font:inherit;font-style:normal;animation:contactEchoDrift var(--echo-dur) ease-in-out .7s infinite alternate;will-change:transform}
.contact-letter__head,.contact-letter>h2,.contact-letter__intro,.contact-message{position:relative;z-index:2}
.contact-letter__scribble{z-index:1}
@keyframes contactEchoIn{to{opacity:1;transform:translate(-50%,-50%) rotate(var(--echo-r)) scale(1)}}
@keyframes contactEchoDrift{from{transform:translate3d(0,0,0)}to{transform:translate3d(var(--echo-dx),var(--echo-dy),0)}}

@media(max-width:700px){
  .contact-v40-hero{height:185svh}
  .contact-letter__echoes span{color:rgba(8,8,8,.03)}
}
@media(prefers-reduced-motion:reduce){
  .contact-letter__echoes span{transition:none!important;animation:none!important;opacity:1;transform:translate(-50%,-50%) rotate(var(--echo-r))}
  .contact-letter__echoes span i{animation:none!important}
}
/* v43 — Formspree submits in place; no submission screen */
.form-honeypot{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important;opacity:0!important;pointer-events:none!important}
.contact-message.is-submitting .contact-send,.contact-send:disabled{opacity:.58;cursor:wait;transform:none!important}


.contact-grove{position:relative;min-height:130svh;padding:12vh var(--pad) 14vh;background:#080808;color:#f1eee8;overflow:hidden}
.contact-grove::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 14% 18%,rgba(255,255,255,.06),transparent 32%),radial-gradient(circle at 86% 14%,rgba(255,255,255,.04),transparent 28%),linear-gradient(180deg,rgba(255,255,255,.015),transparent 36%);pointer-events:none}
.contact-grove__intro{position:relative;z-index:1;display:flex;justify-content:space-between;gap:20px;font:500 clamp(9px,.65vw,12px)/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.15em;color:rgba(241,238,232,.5)}
.contact-grove__lead{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(280px,.7fr);gap:3vw;align-items:end;margin:9vh 0 8vh}
.contact-grove__lead p{margin:0;font-size:clamp(58px,9vw,162px);font-weight:620;letter-spacing:-.09em;line-height:.74}
.contact-grove__lead small{display:block;justify-self:end;width:min(32vw,430px);font-size:clamp(16px,1.2vw,22px);line-height:1.08;letter-spacing:-.035em;color:rgba(241,238,232,.62)}
.contact-grove__grid{position:relative;z-index:1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;align-items:start}
.grove-tree{display:grid;gap:18px;padding:16px;border:1px solid rgba(241,238,232,.12);background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.025));box-shadow:0 24px 64px rgba(0,0,0,.20)}
.grove-tree__viewer{position:relative;aspect-ratio:1/1.12;overflow:hidden;background:#111}
.grove-tree__viewer iframe{display:block;width:100%;height:100%;border:0}
.grove-tree__body{display:grid;gap:14px}
.grove-tree__meta{display:grid;gap:6px}
.grove-tree__meta span{font:500 10px/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.16em;color:rgba(241,238,232,.48)}
.grove-tree__meta strong{font-size:clamp(28px,2.6vw,46px);line-height:.84;letter-spacing:-.08em;font-weight:610}
.grove-tree__body p{margin:0;font-size:clamp(13px,1vw,16px);letter-spacing:.02em;color:rgba(241,238,232,.62)}
.grove-tree__actions{display:flex;flex-wrap:wrap;gap:10px;padding-top:4px}
.grove-tree__actions a,.grove-tree__actions button{appearance:none;border:1px solid rgba(241,238,232,.16);background:rgba(255,255,255,.04);color:#f1eee8;padding:11px 14px;border-radius:999px;font:600 10px/1 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.15em;text-transform:uppercase;text-decoration:none;transition:transform .2s ease,background .2s ease,border-color .2s ease;cursor:pointer}
.grove-tree__actions a:hover,.grove-tree__actions button:hover{transform:translateY(-1px);background:rgba(255,255,255,.08);border-color:rgba(241,238,232,.28)}
.grove-tree--github{border-color:rgba(243,168,196,.30)}
.grove-tree--linkedin{border-color:rgba(207,217,234,.24)}
.grove-tree--whatsapp{border-color:rgba(124,255,91,.28)}
@media(max-width:1100px){.contact-grove__grid{grid-template-columns:repeat(2,minmax(0,1fr))}.contact-grove__lead{grid-template-columns:1fr;gap:18px}.contact-grove__lead small{justify-self:start;width:min(70ch,100%)}}
@media(max-width:700px){.contact-grove{padding-inline:18px;padding-bottom:16vh;min-height:auto}.contact-grove__intro{font-size:8px;line-height:1.35;align-items:flex-start}.contact-grove__lead{margin:7vh 0 5vh;gap:12px}.contact-grove__lead p{font-size:18vw;line-height:.76}.contact-grove__lead small{width:100%;font-size:15px;line-height:1.1}.contact-grove__grid{grid-template-columns:1fr;gap:16px}.grove-tree{padding:12px}.grove-tree__viewer{aspect-ratio:1/1.05}.grove-tree__meta strong{font-size:10.6vw}.grove-tree__actions{gap:8px}.grove-tree__actions a,.grove-tree__actions button{flex:1 1 auto;justify-content:center;text-align:center;padding:12px 10px}}

/* v55 contact performance: isolate the heavy Grove from the rest of the page. */
.contact-grove{content-visibility:auto;contain-intrinsic-size:130vh}
.grove-tree{contain:layout paint style}
.grove-tree__viewer iframe:not([src]){background:radial-gradient(circle at 50% 40%,rgba(255,255,255,.06),transparent 38%),#101112}
