.ref-page{max-width:1120px;margin:26px auto 40px}.ref-hero{position:relative;overflow:hidden;min-height:360px;border:1px solid #d6e7e5;border-top:4px solid #17a39a;border-radius:18px;background:linear-gradient(110deg,#f1fbf9 0%,#fffaf3 56%,#f6fbfb 100%);padding:42px 48px;box-sizing:border-box}.ref-hero-copy{position:relative;z-index:2;width:48%;max-width:520px}.ref-kicker{display:inline-block;padding:7px 13px;border-radius:999px;background:#ddf5f1;color:#087e78;font-size:13px;font-weight:800;text-transform:uppercase;letter-spacing:.04em}.ref-hero h1{margin:18px 0 14px;font-size:42px;line-height:1.05;color:#102b36}.ref-hero h1 strong{display:block;color:#ff4d19}.ref-hero p{font-size:16px;line-height:1.65;color:#526a73;margin:0 0 20px}.ref-actions{display:flex;gap:10px;flex-wrap:wrap}.ref-btn{display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:0 18px;border-radius:9px;text-decoration:none;font-weight:700;border:1px solid #19a49d;color:#087f79;background:#fff}.ref-btn.primary{background:#ff4d19;border-color:#ff4d19;color:#fff}.ref-hero-art{position:absolute;z-index:1;right:-22px;top:12px;width:61%;height:340px;object-fit:contain;object-position:right center;pointer-events:none}.ref-how{margin-top:16px;border:1px solid #dce8e7;border-radius:16px;background:#fff;padding:24px}.ref-how-head{text-align:center;margin-bottom:18px}.ref-how-head h2{margin:0 0 6px;font-size:27px}.ref-how-head p{margin:0;color:#6a7d84}.ref-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.ref-step{position:relative;min-height:120px;border:1px solid #dbe9e7;border-radius:14px;background:#fbfefe;padding:18px 18px 18px 54px}.ref-step-no{position:absolute;left:17px;top:18px;width:27px;height:27px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:#def5f1;color:#07877f;font-weight:800}.ref-step h3{margin:0 0 8px;font-size:16px}.ref-step p{margin:0;color:#60757d;line-height:1.55}.ref-note{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:16px;padding:16px 20px;border:1px solid #f1dfcf;border-radius:14px;background:#fff9f4}.ref-note b{color:#102b36}.ref-note span{color:#697c83}.ref-referrer{white-space:nowrap;padding:7px 12px;border-radius:999px;background:#e7f7f4;color:#087f79;font-weight:700}
@media(max-width:820px){.ref-page{margin-top:14px}.ref-hero{padding:28px 22px 250px;min-height:0}.ref-hero-copy{width:100%;max-width:none}.ref-hero h1{font-size:34px}.ref-hero-art{top:auto;right:-10%;bottom:-4px;width:120%;height:250px;object-position:center bottom}.ref-steps{grid-template-columns:1fr}.ref-note{align-items:flex-start;flex-direction:column}.ref-referrer{white-space:normal}}
@media(max-width:520px){.ref-hero{padding:24px 18px 220px}.ref-hero h1{font-size:30px}.ref-hero-art{height:220px}.ref-how{padding:18px 14px}.ref-btn{flex:1}}