/* ByteCase contact and feedback form */
.contact-hero{
  padding:100px 0 75px;
  background:
    radial-gradient(circle at 82% 26%,rgba(16,185,129,.13),transparent 34%),
    linear-gradient(180deg,#111820,#0e1116);
  border-bottom:1px solid rgba(141,148,158,.14)
}
.contact-hero-grid{
  display:grid;
  grid-template-columns:1.12fr .88fr;
  gap:75px;
  align-items:start
}
.contact-hero h1{
  max-width:850px;
  margin:.25em 0;
  font-size:clamp(3.6rem,7vw,6.7rem);
  line-height:.92;
  letter-spacing:-.06em
}
.contact-response-note,
.contact-boundary-card,
.contact-form-card,
.contact-alternative{
  border:1px solid rgba(141,148,158,.2);
  border-radius:18px;
  background:linear-gradient(145deg,var(--panel),#141a20)
}
.contact-response-note{
  max-width:720px;
  margin-top:32px;
  padding:24px
}
.contact-response-note>span,
.contact-alternative>span{
  color:var(--green);
  font-size:.7rem;
  font-weight:900;
  letter-spacing:.1em;
  text-transform:uppercase
}
.contact-response-note>strong{
  display:block;
  margin:7px 0;
  color:#fff;
  font-size:1.1rem
}
.contact-response-note p,
.contact-boundary-card p,
.contact-alternative p{
  color:#aeb7be
}
.contact-boundary-card{
  padding:30px;
  border-color:rgba(245,158,11,.3)
}
.contact-boundary-card h2{
  font-size:2rem
}
.contact-boundary-card ul{
  list-style:none;
  margin:24px 0 0;
  padding:0
}
.contact-boundary-card li{
  position:relative;
  padding:10px 0 10px 25px;
  border-bottom:1px solid rgba(141,148,158,.12);
  color:#bdc5cb
}
.contact-boundary-card li::before{
  content:"—";
  position:absolute;
  left:0;
  color:#fbbf24;
  font-weight:900
}
.contact-path-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:18px
}
.contact-path-grid article{
  min-height:245px;
  padding:27px;
  border:1px solid rgba(141,148,158,.18);
  border-radius:17px;
  background:linear-gradient(145deg,var(--panel),#141a20)
}
.contact-path-grid article>span{
  color:var(--green);
  font-weight:900;
  letter-spacing:.12em
}
.contact-path-grid h3{
  margin:17px 0 8px;
  font-size:1.35rem
}
.contact-path-grid p{
  color:#aeb7be
}
.contact-form-grid{
  display:grid;
  grid-template-columns:.78fr 1.22fr;
  gap:70px;
  align-items:start
}
.contact-form-intro{
  position:sticky;
  top:110px
}
.contact-form-intro h2{
  font-size:clamp(2.3rem,4vw,3.8rem)
}
.contact-form-intro>p{
  color:#b8c0c7
}
.contact-alternative{
  margin-top:28px;
  padding:23px
}
.contact-alternative a{
  color:var(--pale);
  font-weight:800
}
.contact-form-card{
  padding:32px;
  border-color:rgba(16,185,129,.3)
}
.bytecase-contact-form{
  display:flex;
  flex-direction:column;
  gap:19px
}
.contact-honeypot{
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  overflow:hidden!important;
  clip:rect(0,0,0,0)!important;
  white-space:nowrap!important
}
.contact-field-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:17px
}
.contact-field{
  display:block
}
.contact-field>span{
  display:block;
  margin-bottom:7px;
  color:#e2e7eb;
  font-size:.84rem;
  font-weight:800
}
.contact-field small{
  color:var(--muted);
  font-weight:600
}
.contact-field input,
.contact-field select,
.contact-field textarea{
  width:100%;
  border:1px solid rgba(141,148,158,.28);
  border-radius:10px;
  background:#0b0f14;
  color:#fff;
  padding:13px 14px;
  font:inherit
}
.contact-field textarea{
  min-height:190px;
  resize:vertical
}
.contact-field input::placeholder,
.contact-field textarea::placeholder{
  color:#65707a
}
.contact-field input:focus,
.contact-field select:focus,
.contact-field textarea:focus{
  outline:3px solid rgba(110,231,183,.3);
  outline-offset:1px;
  border-color:#34d399
}
.contact-form-policy{
  padding:15px 17px;
  border-left:3px solid rgba(16,185,129,.5);
  background:rgba(16,185,129,.05)
}
.contact-form-policy p{
  margin:0;
  color:#9faab2;
  font-size:.79rem
}
.contact-form-actions{
  display:flex;
  align-items:center;
  gap:18px;
  flex-wrap:wrap
}
.contact-form-actions button:disabled{
  cursor:wait;
  opacity:.65
}
.contact-form-status{
  color:#b8c0c7;
  font-size:.86rem
}
.contact-form-status[data-state="success"]{
  color:#6ee7b7
}
.contact-form-status[data-state="error"]{
  color:#fca5a5
}
.contact-configuration-warning{
  display:flex;
  flex-direction:column;
  gap:3px;
  padding:14px 16px;
  border:1px solid rgba(245,158,11,.35);
  border-radius:10px;
  background:rgba(245,158,11,.07);
  color:#fde68a;
  font-size:.82rem
}
.contact-configuration-warning code{
  color:#fff
}
@media(max-width:1050px){
  .contact-path-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))
  }
}
@media(max-width:900px){
  .contact-hero-grid,
  .contact-form-grid{
    grid-template-columns:1fr
  }
  .contact-form-intro{
    position:static
  }
}
@media(max-width:620px){
  .contact-hero{
    padding:72px 0 54px
  }
  .contact-hero h1{
    font-size:clamp(3rem,15vw,4.5rem)
  }
  .contact-path-grid,
  .contact-field-grid{
    grid-template-columns:1fr
  }
  .contact-path-grid article{
    min-height:auto
  }
  .contact-form-card{
    padding:22px
  }
  .contact-form-actions{
    align-items:stretch;
    flex-direction:column
  }
  .contact-form-actions .button{
    width:100%
  }
}