:root{
  --deep:#173e48;
  --sky:#a8dde0;
  --mint:#63c8c2;
  --coral:#ff7f61;
  --paper:#f6fcfb;
  --ink:#17353d;
  --muted:#68858a;
}
*{box-sizing:border-box}
body{
  margin:0;
  min-height:100vh;
  display:grid;
  place-items:center;
  padding:24px;
  background:linear-gradient(165deg,#f9ffff 0%,#dff3f1 58%,#b8e3e2 100%);
  color:var(--ink);
  font-family:-apple-system,BlinkMacSystemFont,"Hiragino Sans","Yu Gothic",Meiryo,sans-serif;
  overflow:hidden;
}
body::before{
  content:"";
  position:fixed;
  width:64vw;
  height:64vw;
  right:-29vw;
  top:-36vw;
  border:1px solid rgba(23,62,72,.13);
  border-radius:50%;
}
body::after{
  content:"";
  position:fixed;
  width:130px;
  height:130px;
  left:-48px;
  bottom:-48px;
  background:var(--coral);
  border-radius:50%;
  box-shadow:0 0 0 28px rgba(255,255,255,.28);
}
main{
  width:min(100%,440px);
  padding:40px;
  background:rgba(255,255,255,.9);
  border:1px solid rgba(23,62,72,.1);
  border-radius:28px;
  box-shadow:0 32px 100px rgba(41,95,101,.2);
  position:relative;
  z-index:1;
  backdrop-filter:blur(18px);
}
.mark{
  width:50px;
  height:50px;
  border-radius:15px;
  background:var(--coral);
  display:grid;
  grid-template-columns:repeat(3,6px);
  gap:4px;
  align-content:center;
  justify-content:center;
  transform:rotate(-3deg);
}
.mark i{width:6px;border-radius:6px;background:#fff}
.mark i:nth-child(1){height:12px}
.mark i:nth-child(2){height:25px}
.mark i:nth-child(3){height:18px}
.eyebrow{margin:26px 0 8px;color:#6d8b90;font-size:9px;font-weight:900;letter-spacing:.17em}
h1{margin:0;font-size:30px;font-weight:800;line-height:1.45;letter-spacing:-.05em;color:var(--deep)}
h1 span{color:var(--coral)}
.company{margin:5px 0 28px;color:var(--muted);font-size:10px}
.error{padding:10px 12px;border-left:3px solid var(--coral);background:#fff0eb;color:#9a4937;font-size:10px;font-weight:800}
label{display:block;margin-bottom:7px;font-size:9px;font-weight:900}
input{width:100%;height:50px;padding:0 14px;border:1px solid #bfdcda;border-radius:12px;background:#fff;outline:none;font:inherit}
input:focus{border-color:var(--mint);box-shadow:0 0 0 3px rgba(99,200,194,.23)}
button{width:100%;height:50px;margin-top:12px;border:0;border-radius:12px;background:var(--coral);color:#fff;font:800 11px inherit;cursor:pointer}
button:hover{background:#ed6f52}
.note{margin:22px 0 0;padding-top:17px;border-top:1px solid #d8e9e7;color:#789298;font-size:8px;line-height:1.8}
@media(max-width:500px){main{padding:30px 24px}h1{font-size:27px}}