/* Start a conversation */
:root{--line:#D3CABA;--err:#B3261E}
.contact{background:var(--ink);color:#fff}
.cwrap{max-width:1200px;margin:0 auto;padding:calc(var(--hh) + clamp(40px,5vw,72px)) 48px clamp(88px,9vw,130px);display:grid;grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);gap:clamp(40px,6vw,96px);align-items:start}
.cintro{padding-top:clamp(8px,2vw,36px)}
.cintro h1{font:300 clamp(44px,5.4vw,76px)/1.08 var(--sans);letter-spacing:-.015em;color:#fff}
.cintro h1 em{display:inline-block;font:italic 400 1.14em/1.05 var(--serif);letter-spacing:-.005em}
.cintro .mk svg{bottom:-.12em}
.js .contact .mk svg{transition:clip-path .7s ease-out}
.js .contact.play .mk svg{transition-delay:1.2s}
.cintro .sup{font:300 clamp(20px,1.9vw,25px)/1.5 var(--sans);color:#E9E3D8;margin-top:clamp(26px,2.6vw,38px);max-width:30ch}
.cintro .alt{font:400 clamp(16px,1.35vw,18px)/1.6 var(--sans);color:var(--fadegray);margin-top:18px;max-width:36ch}
.tf{transition-delay:.5s!important}

/* form panel */
.panel{background:var(--cream);color:var(--ink);border-radius:6px;padding:clamp(32px,3.4vw,48px) clamp(26px,3.4vw,48px) clamp(28px,3vw,40px)}
.panel h2{font:500 clamp(20px,1.75vw,23px)/1.4 var(--sans);letter-spacing:-.005em;max-width:34ch;text-wrap:balance}
form{margin-top:26px}
.row2{display:grid;grid-template-columns:1fr 1fr;gap:0 20px}
.fld{margin-bottom:20px}
.fld label{display:block;font:500 14px/1.3 var(--sans);color:var(--ink);margin-bottom:8px}
.fld label .opt{font-weight:400;color:var(--muted)}
.fld input,.fld select,.fld textarea{width:100%;font:400 16px/1.4 var(--sans);color:var(--ink);background:#fff;border:1px solid var(--line);border-radius:6px;padding:13px 14px;appearance:none;-webkit-appearance:none}
.fld textarea{min-height:128px;resize:vertical}
.fld textarea::placeholder{color:#8a8379;opacity:1;line-height:1.5}
.fld select{padding-right:44px;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' viewBox='0 0 14 9'%3E%3Cpath d='M1 1l6 6 6-6' fill='none' stroke='%23121212' stroke-width='1.6'/%3E%3C/svg%3E") no-repeat right 16px center;cursor:pointer}
.fld input:focus,.fld select:focus,.fld textarea:focus{outline:2px solid var(--orange);outline-offset:1px;border-color:var(--orange)}
.fld.bad input,.fld.bad select{border-color:var(--err)}
.fld .msg{display:none;font:400 13.5px/1.4 var(--sans);color:var(--err);margin-top:6px}
.fld.bad .msg{display:block}
.fld .from{display:none;font:400 13.5px/1.4 var(--sans);color:var(--muted);margin-top:7px}
.fld .from.on{display:block}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.send{display:flex;flex-wrap:wrap;align-items:center;gap:14px 22px;margin-top:6px}
.panel .btnp{font-size:16px;padding:15px 28px}
.panel .btnp[disabled]{opacity:.6;cursor:progress}
.reply{font:400 14.5px/1.45 var(--sans);color:var(--muted)}
.ferr{display:none;margin-top:16px;font:400 15px/1.5 var(--sans);color:var(--err)}
.ferr.on{display:block}
.ferr a{color:inherit}

/* Calendly line */
.cal{margin-top:30px;padding-top:24px;border-top:1px solid #E1D9CB;display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 12px}
.cal .q{font:italic 700 clamp(20px,1.8vw,23px)/1.3 var(--serif);color:var(--ink);font-optical-sizing:none;font-variation-settings:'opsz' 11}
.cal .tl{color:var(--ink);font-size:15.5px;cursor:pointer}

/* confirmation */
.done{display:none}
.panel.sent form,.panel.sent > h2,.panel.sent .cal{display:none}
.panel.sent .done{display:block}
.done:focus{outline:none}
.done .dash{display:block;width:36px;height:2px;background:var(--orange);margin-bottom:22px}
.done h2{font:300 clamp(30px,3vw,40px)/1.15 var(--sans);letter-spacing:-.01em;max-width:none}
.done h2 em{display:inline-block;font:italic 700 1.08em/1 var(--serif);color:var(--orange);font-optical-sizing:none;font-variation-settings:'opsz' 11}
.done p{font:400 clamp(16.5px,1.4vw,18px)/1.6 var(--sans);color:var(--body);margin-top:18px;max-width:44ch}
.done .skip2{margin-top:30px;padding-top:26px;border-top:1px solid #E1D9CB;display:flex;flex-wrap:wrap;align-items:center;gap:14px 22px}
.done .skip2 .q{font:italic 700 clamp(22px,2vw,26px)/1.3 var(--serif);color:var(--ink);margin:0;font-optical-sizing:none;font-variation-settings:'opsz' 11}
.done .later{font-size:15px;color:var(--muted);margin-top:22px}

@media (max-width:760px){
  .cwrap{grid-template-columns:1fr;padding:calc(var(--hh) + 24px) 20px 72px;gap:40px}
  .cintro{padding-top:0}
  .cintro h1{font-size:44px}
  .cintro .sup{font-size:20px;max-width:none}
  .row2{grid-template-columns:1fr}
  .panel{padding:30px 20px 28px}
  .send{flex-direction:column;align-items:stretch}
  .panel .btnp{width:100%;text-align:center}
  .done .skip2{flex-direction:column;align-items:stretch}
}