/* === ABOUT light === */
.about{position:relative;}
.about--light{
  background:var(--about-bg);
  color:var(--about-text);
  padding:84px 0;
  overflow:visible;
}

@media (max-width:720px){

    
.about--light {
  background: var(--about-bg);
  color: var(--about-text);
  padding: 30px 0px 0px 0px;
  overflow: visible;
}   
}

.about__hero{
  width:min(1180px, 94vw);
  margin:0 auto 80px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:48px;
}
.about__certificate{
  flex:1;
  background:transparent;
  border:0;
  border-radius:0;
  box-shadow:none;
  color:var(--about-text);
  padding:0;
  display:flex;
  flex-direction:column;
  gap:22px;
}
.certificate__btn{
  display:inline-flex;
  align-items:center;
  gap:14px;
  background:#071636;
  color:#ffffff;
  text-decoration:none;
  font-weight:700;
  padding:0.9rem 1.6rem;
  border-radius:999px;
  box-shadow:0 20px 32px rgba(7, 22, 54, .22);
  transition:transform .2s ease, box-shadow .2s ease;
  align-self:flex-start;
}
.certificate__btn:hover{
  transform:translateY(-1px);
  box-shadow:0 30px 46px rgba(15,30,53,.28);
}
.certificate__btn-icon{
  width:34px;
  height:34px;
  border-radius:999px;
  background:#cf145f;
  display:grid;
  place-items:center;
  box-shadow:0 12px 22px rgba(207,20,95,.35);
}
.certificate__btn-icon svg{display:block;}

@media (max-width: 1080px){
  .about__hero{
    flex-direction:column;
    text-align:left;
    gap:36px;
  }
  .about__media{
    max-width:520px;
    width:100%;
    order:2;
  }
  .about__certificate{
    width:100%;
    padding:0;
    order:1;
  }
  .certificate__btn{
    align-self:center;
  }
}

@media (max-width: 640px){
  .about__certificate{
    padding:0;
  }
  .certificate__btn{
    width:100%;
    justify-content:center;
  }
}

/* ================= ORDER ================= */
.order{
  background:#f7f7f8;
  padding:88px 0;
}
.order__inner{
  width:min(900px,94%);
  margin-inline:auto;
  display:flex;
  flex-direction:column;
  gap:28px;
  align-items:center;
  text-align:center;
  color:#0f1f35;
}
.order__head h2{
  margin:8px 0;
  font-size:clamp(30px,4.6vw,42px);
}
.order__head p{
  margin:0;
  color:#4a5765;
}
.order__eyebrow{
  text-transform:uppercase;
  letter-spacing:.18em;
  font-weight:700;
  font-size:13px;
  color:#18b46b;
  margin:0;
}
.order__form{
  width:100%;
  display:flex;
  flex-direction:column;
  gap:18px;
}
.order__grid{
  display:grid;
  gap:16px;
  width:100%;
}
.order__grid--two{
  grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
}
.order__grid--three{
  grid-template-columns:repeat(auto-fit,minmax(200px,1fr));
}
.order__field{
  display:flex;
  flex-direction:column;
  gap:8px;
  text-align:left;
}
.order__field--full{
  width:100%;
}
.order__label{
  font-size:13px;
  font-weight:700;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:#6a7382;
}
.order__field input,
.order__field select,
.order__field textarea{
  width:100%;
  border:1px solid #dfe4eb;
  border-radius:18px;
  padding:14px 16px;
  font-size:16px;
  font-family:inherit;
  background:#ffffff;
  color:#10233a;
  transition:border-color .2s, box-shadow .2s;
}
.order__field textarea{
  min-height:130px;
  resize:vertical;
}
.order__field input:focus,
.order__field select:focus,
.order__field textarea:focus{
  outline:none;
  border-color:#1eb975;
  box-shadow:0 0 0 3px rgba(30,185,117,.2);
}
.order__field select{
  appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg width='16' height='10' viewBox='0 0 16 10' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M2 2.5 8 8l6-5.5' stroke='%230f1f35' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:calc(100% - 18px) center;
}
.order__checkbox{
  display:flex;
  align-items:flex-start;
  gap:12px;
  font-size:15px;
  color:#4a5765;
  text-align:left;
  justify-content:center;
}
.order__checkbox input{
  appearance:none;
  width:20px;
  height:20px;
  border:1px solid #dfe4eb;
  border-radius:6px;
  margin-top:2px;
  display:grid;
  place-items:center;
  cursor:pointer;
}
.order__checkbox input::before{
  content:"";
  width:12px;
  height:12px;
  border-radius:3px;
  background:#1eb975;
  display:block;
  opacity:0;
  transform:scale(.8);
  transition:opacity .2s ease, transform .2s ease;
}
.order__checkbox input:checked::before{
  opacity:1;
  transform:scale(1);
}
.order__checkbox a{
  color:#0f63c2;
  text-decoration:underline;
}
.order__btn{
  align-self:center;
  background:#0f1f35;
  color:#ffffff;
  padding:1.1rem 1.8rem;
}
.order__btn .btn__arrow{
  background:#ffffff;
}
.order__btn .btn__arrow svg{
  display:block;
}
