/* ECHO site v2 · contact page (A): echo rings + copy on the left, the live form on a glass card on the right. */
:root{--gut:max(24px,calc((100vw - 1328px)/2))}
.cp-page{background:radial-gradient(55% 60% at 24% 60%,#faf3e7,#efe8db 60%,#e8e1d5)}
.cp{position:relative;min-height:100vh;min-height:100svh;display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:64px;align-items:center;padding:120px var(--gut) 70px;overflow:hidden}
.cp-rings{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.cp-copy,.cp-card{position:relative;z-index:1}
.cp-crumbs{display:block;font-size:13px;color:#666158}.cp-crumbs a{color:inherit;text-decoration:none;border-bottom:1px solid rgba(16,16,14,.2)}
.cp-eyebrow{margin-top:30px;font-family:"IBM Plex Mono",monospace;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:#7a6650}
.cp-title{margin-top:18px;font-size:clamp(48px,5.6vw,88px);font-weight:500;letter-spacing:-.06em;line-height:.95;max-width:9.5em}
.cp-intro{margin-top:22px;max-width:480px;font-size:clamp(15.5px,1.2vw,17.5px);line-height:1.6;color:#4a463f;background:rgba(242,238,229,.55);border-radius:10px}
.cp-direct{margin-top:24px;font-size:15px;color:#2b2925}.cp-direct a{color:#10100e}
.cp-card{padding:34px 34px 30px;border-radius:28px;background:rgba(251,250,246,.66);backdrop-filter:blur(20px) saturate(1.1);-webkit-backdrop-filter:blur(20px) saturate(1.1);border:1px solid rgba(255,255,255,.85);box-shadow:0 60px 120px -60px rgba(40,30,10,.45)}
/* the live form, restyled */
.cp .contact-form{margin:0;max-width:none}
.cp .contact-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.cp .contact-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.cp .contact-field{display:block;margin-top:14px}
.cp .contact-row .contact-field{margin-top:0}
.cp .contact-field span{display:block;margin-bottom:7px;font-size:13px;color:#4a463f}
.cp input[type=text],.cp input[type=email],.cp select,.cp textarea{width:100%;box-sizing:border-box;font:inherit;font-size:16px;color:#10100e;background:rgba(255,255,255,.78);border:1px solid rgba(16,16,14,.16);border-radius:14px;padding:13px 15px;outline:none;transition:border-color .2s,box-shadow .2s,background .2s;-webkit-appearance:none;appearance:none}
.cp select{background-image:linear-gradient(45deg,transparent 50%,#4a463f 50%),linear-gradient(135deg,#4a463f 50%,transparent 50%);background-position:calc(100% - 20px) 50%,calc(100% - 15px) 50%;background-size:5px 5px;background-repeat:no-repeat;padding-right:40px}
.cp textarea{min-height:150px;resize:vertical;line-height:1.5}
.cp input:focus,.cp select:focus,.cp textarea:focus{border-color:#10100e;background:#fff;box-shadow:0 0 0 4px rgba(228,211,187,.55)}
.cp textarea::placeholder{color:#8a857c}
.cp .contact-privacy{margin-top:12px;font-size:12.5px;color:#666158}
.cp .contact-actions{margin-top:18px;display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.cp .contact-status{font-size:14px;color:#4a463f}
.cp .contact-status[data-state=ok]{color:#2f5d46}.cp .contact-status[data-state=error]{color:#9a3b2e}
/* entrance */
@keyframes v2up{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}@keyframes v2card{from{opacity:0;transform:translateY(40px) scale(.97);filter:blur(8px)}to{opacity:1;transform:none;filter:none}}
html.js:not(.static) .cp-copy>*,html.js:not(.static) .cp-card{animation:v2up .7s cubic-bezier(.16,1,.3,1) both}
html.js:not(.static) .cp-card{animation-delay:.12s}
@media (prefers-reduced-motion:reduce){html.js .cp-copy>*,html.js .cp-card{animation:none}}
@media (max-width:900px){
  .cp{grid-template-columns:minmax(0,1fr);gap:30px;padding:100px 20px 50px;min-height:0}
  .cp-card{padding:24px 18px 22px;border-radius:22px}
  .cp .contact-row{grid-template-columns:minmax(0,1fr);gap:0}
  .cp .contact-row .contact-field+.contact-field{margin-top:14px}
}
.cp input,.cp select,.cp textarea{min-width:0;max-width:100%}
.cp-card,.cp-copy{min-width:0}

/* Aurora backgrounds (2026-10-23, Founder picked B). */
.cp-page{background:radial-gradient(55% 60% at 24% 60%,#fffbf2,rgba(255,251,242,0) 70%),radial-gradient(40% 45% at 92% 8%,rgba(222,186,134,.8),rgba(222,186,134,0) 70%),radial-gradient(40% 45% at 90% 95%,rgba(160,200,196,.8),rgba(160,200,196,0) 70%),linear-gradient(160deg,#f9f4ea,#e8dbc5 60%,#d8c6aa)}