@import url("https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,500;0,9..144,600;1,9..144,500&family=Inter:wght@400;500;600;700&display=swap");

:root{
  --intk-ink:#0d1418;
  --intk-muted:#68737a;
  --intk-cream:#f1ebe1;
  --intk-paper:#faf5ed;
  --intk-teal:#0d7d78;
  --intk-teal-dark:#085f5b;
  --intk-teal-soft:#e3eeea;
  --intk-line:#dbd2c6;
  --intk-error:#a93e38;
  --head:"Fraunces","Times New Roman",serif;
  --body:"Inter",system-ui,-apple-system,"Segoe UI",sans-serif;
  --blue:var(--intk-teal);
  --blue-deep:var(--intk-ink);
  --green:var(--intk-teal);
  --green-d:var(--intk-teal-dark);
  --cyan-d:var(--intk-teal-dark);
  --soft:var(--intk-cream);
  --sky:var(--intk-teal-soft);
  --line:var(--intk-line);
  --ink-2:var(--intk-muted);
  color-scheme:light;
}

*{box-sizing:border-box}
html{
  background:var(--intk-cream);
  color:var(--intk-ink);
  font-family:var(--body);
  -webkit-text-size-adjust:100%;
}
body{
  min-height:100%;
  margin:0;
  background:var(--intk-cream);
  color:var(--intk-ink);
  font-family:var(--body);
  text-rendering:optimizeLegibility;
}
button,input,select,textarea{font:inherit}
button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,a:focus-visible{
  outline:3px solid rgba(13,125,120,.26);
  outline-offset:3px;
}

.intk-promo{
  min-height:38px;
  padding:9px 18px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  background:var(--intk-ink);
  color:#fff;
  font-family:var(--body);
  font-size:11px;
  font-weight:500;
  line-height:1.35;
  letter-spacing:.015em;
}
.intk-promo b{
  font-family:var(--body);
  font-size:10px;
  font-weight:700;
  letter-spacing:.11em;
  text-transform:uppercase;
}
.intk-promo span{color:rgba(255,255,255,.76)}
.intk-head{
  background:rgba(250,245,237,.94);
  border-bottom:1px solid var(--intk-line);
  backdrop-filter:blur(14px);
}
.intk-head-in{
  min-height:72px;
  max-width:760px;
  padding:14px 24px;
}
.intk-brand{
  display:inline-flex;
  align-items:center;
  gap:10px;
  color:var(--intk-ink);
  text-decoration:none;
}
.intk-brand__seal{
  position:relative;
  width:34px;
  height:34px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:var(--intk-ink);
  color:var(--intk-paper);
  font-family:var(--head);
  font-size:19px;
  font-weight:600;
  line-height:1;
}
.intk-brand__dot{
  position:absolute;
  right:1px;
  bottom:2px;
  width:8px;
  height:8px;
  border:2px solid var(--intk-paper);
  border-radius:50%;
  background:var(--intk-teal);
}
.intk-brand__word{
  font-family:var(--head);
  font-size:27px;
  font-weight:600;
  line-height:1;
  letter-spacing:-.035em;
}
.intk-secure{
  right:24px;
  gap:7px;
  color:var(--intk-muted);
  font-family:var(--body);
  font-size:11px;
  font-weight:600;
}
.intk-secure svg{
  width:16px;
  height:16px;
  stroke:var(--intk-teal);
}

.intk-wrap{
  width:100%;
  max-width:650px;
  padding:0 24px 84px;
}
.prog{
  top:0;
  margin:0 -3px;
  padding:20px 3px 11px;
  background:rgba(241,235,225,.94);
  backdrop-filter:blur(12px);
}
.prog-top{margin-bottom:11px}
.prog-back{
  min-height:38px;
  padding:0 8px 0 0;
  color:var(--intk-teal-dark);
  font-family:var(--body);
  font-size:12px;
  font-weight:700;
  letter-spacing:.02em;
}
.prog-back svg{stroke:var(--intk-teal-dark)}
.prog-count{
  color:var(--intk-muted);
  font-family:var(--body);
  font-size:10px;
  font-weight:700;
  letter-spacing:.1em;
  text-transform:uppercase;
}
.prog-bar{
  height:5px;
  background:#ded5c9;
}
.prog-fill{background:var(--intk-teal)}

.step{padding-top:38px}
.step .kick,
.appr .kk{
  color:var(--intk-teal-dark);
  font-family:var(--body);
  font-size:10px;
  font-weight:700;
  letter-spacing:.12em;
}
.step h2,
.stop h2,
.loader h2,
.appr h2{
  color:var(--intk-ink);
  font-family:var(--head);
  font-weight:500;
  letter-spacing:-.035em;
  text-wrap:balance;
}
.step h2{
  margin:10px 0 9px;
  font-size:34px;
  line-height:1.08;
}
.step .sub,
.stop p,
.loader p,
.appr p{
  color:var(--intk-muted);
  font-family:var(--body);
  line-height:1.62;
}

.opts{margin-top:27px;gap:11px}
.opt{
  min-height:61px;
  padding:17px 18px;
  border:1px solid var(--intk-line);
  border-radius:16px;
  background:rgba(250,245,237,.92);
  color:var(--intk-ink);
  font-family:var(--body);
  box-shadow:none;
  transition:border-color .2s ease,background-color .2s ease,transform .2s ease;
}
.opt.sel{
  border-color:var(--intk-teal);
  background:rgba(13,125,120,.08);
  box-shadow:0 0 0 1px var(--intk-teal);
}
.opt .mn h3,
.grp-q-t,
.pq-label,
.drop h3,
.dcard b{
  color:var(--intk-ink);
  font-family:var(--body);
  font-weight:600;
}
.opt .mn h3{font-size:15px;line-height:1.35}
.opt .mn p{color:var(--intk-muted);font-size:12px;line-height:1.45}
.opt .rd,.opt .ck{border-color:#bcb3a9}
.opt.sel .rd{border-color:var(--intk-teal)}
.opt.sel .rd::after,
.opt.sel .ck{background:var(--intk-teal);border-color:var(--intk-teal)}

.grp-q-t,.pq-label{font-size:16px;line-height:1.4}
.fld label{
  color:var(--intk-muted);
  font-family:var(--body);
  font-size:10px;
  font-weight:700;
  letter-spacing:.09em;
}
.inp{
  height:58px;
  border:1px solid var(--intk-line);
  border-radius:14px;
  background:var(--intk-paper);
  color:var(--intk-ink);
  font-family:var(--body);
  font-size:16px;
  font-weight:500;
}
.inp::placeholder{color:#978f87}
.inp:focus{
  border-color:var(--intk-teal);
  box-shadow:0 0 0 3px rgba(13,125,120,.12);
}
select.inp{background-color:var(--intk-paper)}
textarea.inp{min-height:130px}

.drop,
.tcard,
.proof,
.dcard,
.intk-wrap .sp-card,
.intk-wrap .appr-provider{
  border:1px solid var(--intk-line);
  background:var(--intk-paper);
  box-shadow:none;
}
.drop{border-style:dashed;border-radius:16px}
.drop:hover,.drop.has{border-color:var(--intk-teal);background:var(--intk-teal-soft)}
.drop svg{stroke:var(--intk-teal)}
.proof,.dcard{background:rgba(227,238,234,.74)}
.tcard{border-radius:22px}
.tcard .tphoto{background:var(--intk-teal-soft)}
.tba .tcol b,.iquote,.iperson b,.proof p{color:var(--intk-ink)}
.tba .tcol.after b{color:var(--intk-teal-dark)}
.tba .tarrow svg{stroke:var(--intk-teal)}

.cont{margin-top:30px}
.cont .btn-green,
.appr .btn-green,
.stop .btn-green{
  width:100%;
  max-width:none;
  min-height:57px;
  padding:0 25px;
  border:0;
  border-radius:999px;
  background:var(--intk-teal);
  color:#fff;
  font-family:var(--body);
  font-size:13px;
  font-weight:700;
  letter-spacing:.055em;
  text-transform:uppercase;
  box-shadow:0 10px 24px rgba(13,125,120,.15);
}
.cont:not(.dis) .btn-green,
.appr .btn-green,
.stop .btn-green{
  animation:intk-breathe 3.2s ease-in-out infinite;
}
.cont.dis .btn-green{
  background:#ded7cd;
  color:#827b73;
  box-shadow:none;
  animation:none;
}
.btn-outline{
  min-height:53px;
  border-color:var(--intk-teal);
  background:transparent;
  color:var(--intk-teal-dark);
  font-family:var(--body);
  font-size:14px;
  font-weight:700;
}
.reassure{color:var(--intk-muted);line-height:1.45}
.reassure svg{stroke:var(--intk-teal)}
.skip{min-height:44px;color:var(--intk-muted)}
.appr .badge{background:var(--intk-teal-soft)}
.appr .badge svg{stroke:var(--intk-teal)}
.appr h2{font-size:43px}
.appr-sum .chip{border-color:var(--intk-teal);background:var(--intk-teal-soft)}
.appr-sum .chip h4{color:var(--intk-teal-dark);font-family:var(--body)}
.appr-sum .chip p{color:var(--intk-ink)}
.spin{border-color:#d9d0c5;border-top-color:var(--intk-teal)}
.lsteps li{color:var(--intk-ink)}
.lsteps li.done .c{background:var(--intk-teal)}

@keyframes intk-breathe{
  0%,100%{box-shadow:0 9px 22px rgba(13,125,120,.14)}
  50%{box-shadow:0 11px 28px rgba(13,125,120,.3)}
}

@media(hover:hover){
  .opt:hover{
    border-color:var(--intk-teal);
    background:rgba(250,245,237,1);
    box-shadow:none;
    transform:translateY(-1px);
  }
  .cont:not(.dis) .btn-green:hover,
  .appr .btn-green:hover,
  .stop .btn-green:hover{background:var(--intk-teal-dark)}
}

@media(max-width:560px){
  .intk-promo{
    min-height:35px;
    padding:8px 13px;
    gap:7px;
    font-size:9px;
    white-space:nowrap;
  }
  .intk-promo b{font-size:8px}
  .intk-head-in{min-height:64px;padding:12px 16px}
  .intk-brand{gap:8px}
  .intk-brand__seal{width:31px;height:31px;font-size:17px}
  .intk-brand__word{font-size:24px}
  .intk-secure{right:16px}
  .intk-secure span{display:none}
  .intk-wrap{padding:0 16px 104px}
  .prog{padding:15px 1px 10px}
  .step{padding-top:29px}
  .step h2{font-size:29px;line-height:1.09}
  .step .sub{font-size:15px}
  .opts{margin-top:23px}
  .opts.two{gap:9px}
  .opts.two .opt{padding:19px 10px}
  .opt{padding:15px;min-height:59px}
  .opt .mn h3{font-size:14px}
  .fld-row{gap:9px}
  .inp{font-size:16px}
  .cont{margin-top:25px}
  .cont .btn-green,
  .appr .btn-green,
  .stop .btn-green{min-height:56px}
  .appr{padding:38px 5px}
  .appr h2{font-size:34px}

  .cont.multi{
    position:fixed;
    z-index:30;
    left:auto;
    right:max(14px,env(safe-area-inset-right));
    bottom:max(14px,env(safe-area-inset-bottom));
    width:auto;
    margin:0;
    padding:0;
    border:0;
    border-radius:0;
    background:transparent;
    box-shadow:none;
    backdrop-filter:none;
    pointer-events:none;
  }
  .cont.multi .btn-green{
    width:auto;
    min-width:170px;
    max-width:calc(100vw - 28px);
    padding:0 24px;
    pointer-events:auto;
  }
  .opts:has(+ .cont.multi){padding-bottom:84px}
}

@media(max-width:370px){
  .intk-promo span{max-width:235px;overflow:hidden;text-overflow:ellipsis}
  .intk-wrap{padding-left:13px;padding-right:13px}
  .step h2{font-size:27px}
}

@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{
    scroll-behavior:auto!important;
    animation-duration:.01ms!important;
    animation-iteration-count:1!important;
    transition-duration:.01ms!important;
  }
}
