
.ways{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:20px}
.way{padding:26px;display:flex;flex-direction:column}
.way .ic{width:44px;height:44px;border-radius:12px;background:var(--teal-soft);color:var(--teal);display:flex;align-items:center;justify-content:center;margin-bottom:16px}
.way small{display:block;color:var(--muted);font-size:13px}
.way b{display:block;font-family:var(--num);font-size:24px;font-weight:600;color:var(--navy);margin:2px 0 6px;letter-spacing:.3px}
.way p{color:var(--muted);font-size:13.5px}
.way .qr{width:88px;height:88px;border:1px solid var(--line);margin:4px 0 0}

.main-grid{display:grid;grid-template-columns:1.25fr 1fr;gap:24px;margin-top:24px}
.form-box{padding:32px}
.form-box h2{font-size:24px;font-weight:600;color:var(--navy)}
.form-box > p{color:var(--muted);font-size:14px;margin:6px 0 10px}
.form-box .grid2{display:grid;grid-template-columns:1fr 1fr;gap:0 14px}
.types{display:flex;gap:8px;flex-wrap:wrap;margin-top:4px}
.types label{margin:0;display:inline-flex}
.types input{display:none}
.types span{display:inline-block;border:1px solid var(--line);border-radius:999px;padding:6px 14px;font-size:13.5px;cursor:pointer;color:var(--ink);transition:.12s}
.types input:checked+span{background:var(--navy);border-color:var(--navy);color:#fff}
.form-box .submit{margin-top:20px;display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.form-box .submit small{color:var(--muted)}
.agree{display:flex;gap:8px;align-items:flex-start;font-size:12.5px;color:var(--muted);margin-top:14px}
.agree input{margin-top:3px;accent-color:var(--teal)}

.info{display:flex;flex-direction:column;gap:20px}
.company{padding:28px}
.company h3{font-size:18px;font-weight:600;color:var(--navy);margin-bottom:14px}
.company dl{display:grid;grid-template-columns:76px 1fr;gap:10px 12px;font-size:14px}
.company dt{color:var(--muted)}
.map{height:220px;border-radius:18px;border:1px solid var(--line);background:
  linear-gradient(0deg,rgba(255,255,255,.6),rgba(255,255,255,.6)),
  repeating-linear-gradient(0deg,#e9e6de 0 1px,transparent 1px 36px),repeating-linear-gradient(90deg,#e9e6de 0 1px,transparent 1px 36px),#f3f1ea;
  display:flex;align-items:center;justify-content:center;flex-direction:column;gap:6px;color:var(--muted);font-size:13px;position:relative}
.map .pin{width:38px;height:38px;border-radius:50% 50% 50% 0;transform:rotate(-45deg);background:var(--teal);box-shadow:0 8px 20px rgba(15,118,110,.35)}
.map .pin::after{content:"";position:absolute;inset:12px;border-radius:50%;background:#fff}

.flow{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.fs{padding:22px;position:relative}
.fs .n{font-family:var(--num);font-weight:600;color:var(--teal);font-size:13px;letter-spacing:2px}
.fs h4{font-size:16px;font-weight:600;color:var(--navy);margin:6px 0 4px}
.fs p{font-size:13px;color:var(--muted)}
@media (max-width:900px){
  .ways,.main-grid,.flow{grid-template-columns:1fr}
  .ways{gap:12px}
  .way{display:grid !important;grid-template-columns:44px 1fr;column-gap:16px;padding:18px;align-items:center}
  .way .ic{margin:0;grid-row:span 3;align-self:start}
  .way b{font-size:20px}
  .way:last-child{grid-template-columns:72px 1fr}
  .way .qr{width:72px;height:72px;margin:0}
  .form-box{padding:22px}
  .form-box .grid2{grid-template-columns:1fr}
}
