:root{
  --support-ink:#14343b;
  --support-muted:#687c80;
  --support-line:#dce8e6;
  --support-mint:#43d3c1;
  --support-mint-dark:#15998b;
  --support-danger:#a23a47;
}

.support-body{
  min-height:100vh;
  margin:0;
  color:var(--support-ink);
  background:
    radial-gradient(circle at 8% 8%,rgba(67,211,193,.14),transparent 28rem),
    radial-gradient(circle at 92% 90%,rgba(117,107,228,.09),transparent 28rem),
    #f4f9f8;
  color-scheme:light;
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}

.support-header{
  display:flex;
  width:min(calc(100% - 42px),1120px);
  min-height:84px;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  margin:auto;
  border-bottom:1px solid rgba(20,52,59,.08);
}

.support-brand{
  display:flex;
  align-items:center;
  gap:11px;
  color:inherit;
  text-decoration:none;
}

.support-brand img{
  width:46px;
  height:46px;
  object-fit:contain;
}

.support-brand strong,
.support-brand small{
  display:block;
}

.support-brand strong{
  color:#697477;
  font-size:23px;
  line-height:1;
  letter-spacing:-.04em;
}

.support-brand strong i{
  color:var(--support-mint);
  font-style:normal;
}

.support-brand small{
  margin-top:5px;
  color:#7b8b8e;
  font-size:9px;
  font-weight:800;
  letter-spacing:.05em;
  text-transform:uppercase;
}

.support-back{
  padding:9px 12px;
  border:1px solid var(--support-line);
  border-radius:999px;
  background:rgba(255,255,255,.82);
  color:#5c7175;
  font-size:11px;
  font-weight:850;
  text-decoration:none;
}

.support-shell{
  display:grid;
  width:min(calc(100% - 42px),1120px);
  grid-template-columns:.88fr 1.12fr;
  gap:52px;
  align-items:center;
  margin:auto;
  padding:58px 0 70px;
}

.support-intro{
  padding:10px 0;
}

.support-kicker{
  display:inline-flex;
  padding:7px 10px;
  border:1px solid #ccebe6;
  border-radius:999px;
  background:rgba(255,255,255,.75);
  color:var(--support-mint-dark);
  font-size:9px;
  font-weight:900;
  letter-spacing:.1em;
}

.support-intro h1{
  max-width:560px;
  margin:18px 0 15px;
  color:var(--support-ink);
  font-size:clamp(40px,5vw,60px);
  line-height:1.02;
  letter-spacing:-.05em;
}

.support-intro>p{
  max-width:550px;
  margin:0;
  color:var(--support-muted);
  font-size:15px;
  line-height:1.7;
}

.support-benefits{
  display:grid;
  gap:10px;
  margin:27px 0 20px;
}

.support-benefits article{
  display:flex;
  align-items:flex-start;
  gap:12px;
  padding:12px;
  border:1px solid rgba(220,232,230,.9);
  border-radius:13px;
  background:rgba(255,255,255,.68);
}

.support-benefits article>span{
  display:grid;
  width:28px;
  height:28px;
  flex:0 0 28px;
  place-items:center;
  border-radius:9px;
  background:#e9f9f6;
  color:var(--support-mint-dark);
  font-size:10px;
  font-weight:950;
}

.support-benefits b,
.support-benefits small{
  display:block;
}

.support-benefits b{
  margin-bottom:3px;
  font-size:11px;
}

.support-benefits small{
  color:#738589;
  font-size:9px;
  line-height:1.5;
}

.support-security-note{
  padding:14px 16px;
  border-left:4px solid #f0aa42;
  border-radius:0 13px 13px 0;
  background:rgba(255,250,240,.92);
}

.support-security-note strong{
  display:block;
  color:#82580f;
  font-size:11px;
}

.support-security-note p{
  margin:4px 0 0;
  color:#826b44;
  font-size:9px;
  line-height:1.55;
}

.support-card{
  overflow:hidden;
  padding:28px;
  border:1px solid var(--support-line);
  border-radius:23px;
  background:rgba(255,255,255,.98);
  box-shadow:0 24px 70px rgba(20,52,59,.11);
}

.support-heading{
  display:flex;
  align-items:center;
  gap:12px;
  margin-bottom:22px;
}

.support-heading>span{
  display:grid;
  width:43px;
  height:43px;
  flex:0 0 43px;
  place-items:center;
  border-radius:13px;
  background:#e9f9f6;
  color:var(--support-mint-dark);
  font-size:18px;
  font-weight:950;
}

.support-heading small,
.support-heading h2{
  display:block;
}

.support-heading small{
  color:#8a999b;
  font-size:8px;
  font-weight:850;
  text-transform:uppercase;
}

.support-heading h2{
  margin:2px 0 0;
  color:var(--support-ink);
  font-size:23px;
  letter-spacing:-.025em;
}

.support-form{
  display:grid;
  gap:15px;
}

.support-grid{
  display:grid;
  gap:13px;
}

.support-grid.two-columns{
  grid-template-columns:1fr 1fr;
}

.support-form label{
  position:relative;
  display:grid;
  gap:7px;
  color:#4d6469;
  font-size:10px;
  font-weight:850;
}

.support-form input,
.support-form select,
.support-form textarea{
  width:100%;
  box-sizing:border-box;
  border:1px solid #cfdedc;
  border-radius:12px;
  padding:13px 14px;
  background:#fff;
  color:var(--support-ink);
  font:inherit;
  font-size:13px;
  outline:none;
}

.support-form textarea{
  min-height:142px;
  resize:vertical;
  line-height:1.55;
}

.support-form input:focus,
.support-form select:focus,
.support-form textarea:focus{
  border-color:var(--support-mint);
  box-shadow:0 0 0 4px rgba(67,211,193,.13);
}

.support-form input:user-invalid,
.support-form select:user-invalid,
.support-form textarea:user-invalid{
  border-color:#d798a0;
}

.support-counter{
  position:absolute;
  right:10px;
  bottom:8px;
  padding:2px 6px;
  border-radius:999px;
  background:rgba(255,255,255,.9);
  color:#869497;
  font-size:8px;
  font-weight:700;
}

.support-consent{
  grid-template-columns:auto 1fr;
  align-items:flex-start;
  gap:9px!important;
  padding:11px 12px;
  border-radius:11px;
  background:#f5f8f8;
  color:#65797d!important;
  font-size:9px!important;
  font-weight:650!important;
  line-height:1.5;
}

.support-consent input{
  width:16px;
  height:16px;
  margin:1px 0 0;
  padding:0;
  accent-color:var(--support-mint-dark);
}

.support-honeypot{
  position:absolute!important;
  left:-10000px!important;
  width:1px!important;
  height:1px!important;
  overflow:hidden!important;
  opacity:0!important;
}

.support-submit,
.support-secondary{
  display:flex;
  min-height:52px;
  align-items:center;
  justify-content:center;
  gap:12px;
  border:0;
  border-radius:999px;
  cursor:pointer;
  font:inherit;
  font-size:13px;
  font-weight:900;
}

.support-submit{
  background:var(--support-mint);
  color:#113a35;
  box-shadow:0 14px 28px rgba(67,211,193,.2);
}

.support-submit:hover{
  transform:translateY(-1px);
  filter:saturate(1.05);
}

.support-submit:disabled{
  cursor:wait;
  opacity:.68;
  transform:none;
}

.support-submit b{
  font-size:18px;
}

.support-message{
  min-height:18px;
  margin:0;
  color:#617579;
  font-size:10px;
  line-height:1.5;
  text-align:center;
}

.support-message[data-kind="error"]{
  color:var(--support-danger);
}

.support-message[data-kind="success"]{
  color:#137c70;
}

.support-success{
  padding:12px 6px 4px;
  text-align:center;
}

.support-success-icon{
  display:grid;
  width:64px;
  height:64px;
  place-items:center;
  margin:0 auto 16px;
  border-radius:50%;
  background:#e7f9f5;
  color:var(--support-mint-dark);
  font-size:30px;
  font-weight:950;
}

.support-success>small{
  color:var(--support-mint-dark);
  font-size:8px;
  font-weight:900;
  letter-spacing:.1em;
}

.support-success h2{
  margin:7px 0 8px;
  color:var(--support-ink);
  font-size:27px;
}

.support-success>p{
  margin:0 auto 20px;
  color:#6b7e82;
  font-size:11px;
  line-height:1.6;
}

.support-ticket{
  padding:17px;
  border:1px solid #cfe9e5;
  border-radius:14px;
  background:#f0fbf9;
}

.support-ticket span,
.support-ticket strong{
  display:block;
}

.support-ticket span{
  color:#6b7e82;
  font-size:9px;
}

.support-ticket strong{
  margin:4px 0 10px;
  color:var(--support-ink);
  font-size:21px;
  letter-spacing:.03em;
}

.support-ticket button{
  border:0;
  background:transparent;
  color:var(--support-mint-dark);
  cursor:pointer;
  font-size:9px;
  font-weight:900;
}

.support-secondary{
  width:100%;
  margin-top:16px;
  border:1px solid var(--support-line);
  background:#fff;
  color:#4e666a;
}

.support-home-link{
  display:inline-block;
  margin-top:15px;
  color:var(--support-mint-dark);
  font-size:10px;
  font-weight:900;
  text-decoration:none;
}

@media(max-width:840px){
  .support-shell{
    grid-template-columns:1fr;
    gap:30px;
    padding:42px 0 55px;
  }

  .support-intro{
    text-align:center;
  }

  .support-intro>p{
    margin-inline:auto;
  }

  .support-benefits,
  .support-security-note{
    max-width:620px;
    margin-inline:auto;
    text-align:left;
  }
}

@media(max-width:590px){
  .support-header,
  .support-shell{
    width:min(calc(100% - 26px),1120px);
  }

  .support-header{
    min-height:72px;
  }

  .support-brand small{
    display:none;
  }

  .support-back{
    padding:8px 10px;
    font-size:9px;
  }

  .support-shell{
    padding:34px 0 45px;
  }

  .support-intro h1{
    font-size:38px;
  }

  .support-card{
    padding:21px;
  }

  .support-grid.two-columns{
    grid-template-columns:1fr;
  }
}
