/* AIANDGRACE contact channel — isolated, translation-stable layout. */
.contact-page{
  position:relative;
  isolation:isolate;
  min-height:900px;
  overflow:hidden;
  padding:86px 0 110px;
}
.contact-page-inner{
  position:relative;
  z-index:2;
  width:min(920px,calc(100% - 40px));
  margin:auto;
}
.contact-page-grid{
  position:absolute;
  inset:0;
  z-index:-2;
  opacity:.46;
  background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);
  background-size:72px 72px;
  mask-image:linear-gradient(to bottom,black,transparent 95%);
}
.contact-page-mark{
  position:absolute;
  z-index:-1;
  right:-6%;
  top:44%;
  color:rgba(241,199,91,.055);
  font:300 clamp(28rem,58vw,52rem)/1 var(--sans);
  transform:translateY(-50%);
}
.contact-page h1{
  margin:28px 0;
  font-family:var(--sans);
  font-size:clamp(4rem,9vw,8rem);
  font-weight:850;
  line-height:.83;
  letter-spacing:-.072em;
  text-transform:uppercase;
}
.contact-page h1 em{
  color:transparent;
  font-style:normal;
  -webkit-text-stroke:1px var(--paper);
}
.contact-page-lead{
  max-width:620px;
  margin-bottom:30px;
  color:var(--muted);
  font-size:1rem;
}
#contactForm{
  position:relative;
  z-index:2;
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:22px 18px;
  width:min(100%,780px);
  margin:0 0 26px;
  padding:28px;
  border:1px solid var(--line-hot);
  background:rgba(2,6,7,.94);
  box-shadow:0 24px 80px rgba(0,0,0,.34);
}
#contactNameField,#contactEmailField,#contactSubjectField,#contactMessageField{
  display:flex;
  min-width:0;
  flex-direction:column;
  gap:9px;
}
#contactSubjectField,#contactMessageField,#contactFormFoot{grid-column:1/-1}
#contactForm label{
  display:flex;
  justify-content:space-between;
  color:var(--paper);
  font:700 .59rem/1 var(--mono);
  letter-spacing:.14em;
}
#contactForm label span{color:#657174;font-size:.5rem}
#contactForm input:not([name="_honey"]),#contactForm select,#contactForm textarea{
  width:100%;
  border:1px solid var(--line);
  border-radius:0;
  padding:14px 15px;
  color:var(--paper);
  background:#020607;
  font:500 .83rem/1.45 var(--mono);
  outline:none;
  transition:border-color .18s,box-shadow .18s;
  -webkit-appearance:none;
  appearance:none;
}
#contactForm select{
  min-height:50px;
  background-image:linear-gradient(45deg,transparent 50%,var(--cyan) 50%),linear-gradient(135deg,var(--cyan) 50%,transparent 50%);
  background-position:calc(100% - 18px) 21px,calc(100% - 13px) 21px;
  background-size:5px 5px,5px 5px;
  background-repeat:no-repeat;
}
#contactForm textarea{min-height:150px;resize:vertical}
#contactForm input:focus,#contactForm select:focus,#contactForm textarea:focus{
  border-color:var(--cyan);
  box-shadow:0 0 0 1px rgba(114,247,232,.2);
}
#contactForm input:user-invalid,#contactForm select:user-invalid,#contactForm textarea:user-invalid{border-color:#f16a64}
#contactFormFoot{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:20px;
  border-top:1px solid var(--line);
  padding-top:22px;
}
#contactFormFoot p{max-width:440px;color:#778286;font-size:.72rem;line-height:1.55}
#contactFormFoot a{color:var(--paper)}
#contactForm button[type="submit"]{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:24px;
  min-height:52px;
  padding:0 20px;
  border:1px solid var(--paper);
  color:var(--ink);
  background:var(--paper);
  font:750 .62rem/1 var(--mono);
  letter-spacing:.14em;
  cursor:pointer;
}
#contactForm button[type="submit"] b{color:var(--ink)}
#contactForm button[type="submit"]:hover{background:var(--cyan);border-color:var(--cyan)}
#contactForm button[type="submit"]:disabled{cursor:wait;opacity:.65}
.form-honey,.form-honey[hidden],#contactForm [name="_honey"]{display:none!important}
.contact-page-copy{margin-top:0}
@media(max-width:820px){
  .contact-page{min-height:0;padding:64px 0 84px}
  .contact-page h1{font-size:clamp(3.4rem,18vw,5.2rem)}
  #contactForm{grid-template-columns:1fr;padding:20px 16px}
  #contactSubjectField,#contactMessageField,#contactFormFoot{grid-column:1}
  #contactFormFoot{grid-template-columns:1fr}
  #contactForm button[type="submit"]{width:100%}
}
@media(max-width:430px){
  .contact-page-inner{width:calc(100% - 28px)}
  #contactForm{gap:18px;padding:18px 14px}
  .contact-page h1{font-size:clamp(3rem,17vw,4.25rem)}
}