.how-page{overflow-x:hidden}

/* HERO */
.how-page .how-hero{padding:132px 0 116px;background:#fff}
.how-page .how-hero-grid{display:grid;grid-template-columns:minmax(0,620px) minmax(320px,1fr);gap:clamp(56px,7vw,120px);align-items:end}
.how-page .how-hero-grid>div:first-child{min-width:0}
.how-page .how-hero .eyebrow{margin-bottom:26px}
.how-page .how-hero h1{margin:0;max-width:620px;font-size:clamp(36px,3.8vw,50px);font-weight:470;line-height:1.12;letter-spacing:-.047em;word-break:keep-all}
.how-page .how-hero-copy{max-width:650px;padding-bottom:4px}
.how-page .how-hero-copy p{margin:0;color:var(--muted);font-size:18px;line-height:1.78;word-break:keep-all}
.how-page .how-hero-copy .button{margin-top:38px}

/* SUPPORT FINDER */
.support-finder{padding:128px 0;background:#f7f8f7}
.support-heading{display:grid;grid-template-columns:220px minmax(0,1fr);gap:clamp(48px,7vw,120px);align-items:start;margin-bottom:72px}
.support-heading>.eyebrow{margin:2px 0 0}
.support-heading h2{margin:0;max-width:760px;font-size:var(--fs-h2);font-weight:510;line-height:1.3;letter-spacing:-.038em}
.support-heading>div>p{margin:24px 0 0;max-width:780px;color:var(--muted);font-size:17px;line-height:1.75}
.support-explorer{display:grid;grid-template-columns:minmax(360px,.82fr) minmax(0,1.18fr);gap:28px;align-items:stretch}
.support-map-panel,.support-result-panel{padding:34px;border:1px solid #e1e6e3;background:#fff;border-radius:12px}
.support-map-panel>.eyebrow,.support-result-panel>.eyebrow{margin-bottom:22px}
.support-map{position:relative;min-height:520px}
.support-map svg{position:absolute;inset:18px 54px 30px 42px;width:calc(100% - 96px);height:calc(100% - 48px)}
.support-map .land{fill:#edf2ef;stroke:#c7d2cc;stroke-width:2}
.support-province{position:absolute;transform:translate(-50%,-50%);border:1px solid #ccd6d1;background:#fff;color:#35433d;border-radius:999px;padding:8px 12px;font-size:13px;font-weight:560;cursor:pointer;transition:.18s;z-index:2}
.support-province:hover,.support-province.is-active{background:var(--brand);border-color:var(--brand);color:#fff}
.support-province[data-support-province="경기"]{left:43%;top:22%}.support-province[data-support-province="강원"]{left:61%;top:18%}.support-province[data-support-province="충북"]{left:52%;top:37%}.support-province[data-support-province="충남"]{left:35%;top:42%}.support-province[data-support-province="전북"]{left:41%;top:56%}.support-province[data-support-province="전남"]{left:31%;top:72%}.support-province[data-support-province="경북"]{left:64%;top:48%}.support-province[data-support-province="경남"]{left:58%;top:66%}.support-province[data-support-province="제주"]{left:28%;top:91%}
.support-result-panel{display:flex;flex-direction:column}
.support-result-panel h3{margin:0 0 12px;font-size:26px;font-weight:540;line-height:1.35;letter-spacing:-.03em}
.support-result-panel>p:not(.eyebrow){margin:0 0 26px;color:var(--muted);font-size:16px;line-height:1.7}
.support-region-list{display:flex;flex-wrap:wrap;gap:8px}
.support-region-chip{border:1px solid #d5ddd8;background:#fff;color:#34423c;border-radius:999px;padding:10px 14px;font-size:14px;cursor:pointer}
.support-region-chip:hover,.support-region-chip.is-active{background:var(--brand);border-color:var(--brand);color:#fff}
.support-direct{margin-top:30px;padding-top:28px;border-top:1px solid #e4e9e6}
.support-direct label{display:block;margin-bottom:11px;font-size:14px;font-weight:520}
.support-direct>div{display:grid;grid-template-columns:1fr auto;gap:8px}
.support-direct input{min-height:46px;border:1px solid #d7dedb;border-radius:8px;padding:0 14px;font:inherit;font-size:15px;outline:none}
.support-direct input:focus{border-color:var(--brand)}
.support-direct button{min-width:78px;border:0;border-radius:8px;background:#eef3f0;color:var(--brand);font-size:14px;font-weight:560;cursor:pointer}
.support-center-result{margin-top:auto;padding:28px;border:1px solid #dce4df;background:#f8faf9;border-radius:10px}
.support-center-result>span{display:block;margin-bottom:9px;color:#708078;font-size:12px;letter-spacing:.06em}
.support-center-result>strong{display:block;font-size:22px;font-weight:540;letter-spacing:-.03em}
.support-center-result>p{margin:12px 0 0;color:var(--muted);font-size:15px;line-height:1.7}
.support-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:24px}
.support-actions .button{margin:0}
.official-links{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:28px}
.official-links a{padding:30px;border:1px solid #e1e6e3;border-radius:12px;background:#fff;color:var(--ink)}
.official-links a:hover{border-color:#b8c7bf;color:var(--brand)}
.official-links span{display:block;margin-bottom:24px;color:#6f7d76;font-size:13px;font-weight:600;letter-spacing:.08em}
.official-links strong{display:block;font-size:21px;font-weight:520;line-height:1.4}
.official-links p{margin:12px 0 0;color:var(--muted);font-size:15px;line-height:1.7}

/* SUPPORT FLOW */
.support-flow{padding:128px 0;background:#fff}
.support-flow .section-head{margin-bottom:64px}
.support-flow .section-title{max-width:760px}
.support-flow .process-row{padding:34px 0}
.support-callout{margin-top:72px;padding:46px 0;border-top:1px solid #dfe5e1;border-bottom:1px solid #dfe5e1;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:56px}
.support-callout>div{max-width:840px}
.support-callout h3{margin:0;font-size:var(--fs-h2);font-weight:510;line-height:1.3;letter-spacing:-.038em}
.support-callout p:not(.eyebrow){margin:18px 0 0;color:var(--muted);font-size:16px;line-height:1.75}
.support-callout .button{flex:0 0 auto}

/* DIRECT PROJECT */
.direct-project{padding:128px 0;background:#123f31;color:#fff}
.direct-grid{display:grid;grid-template-columns:220px minmax(0,1fr);gap:clamp(48px,7vw,120px);align-items:start}
.direct-grid>.eyebrow{color:#b7cdc2;margin-top:4px}
.direct-grid h2{margin:0;max-width:760px;font-size:var(--fs-h2);font-weight:510;line-height:1.3;letter-spacing:-.038em}
.direct-grid>div>p{margin:24px 0 0;max-width:820px;color:rgba(255,255,255,.74);font-size:17px;line-height:1.75}
.direct-steps{display:flex;flex-wrap:wrap;gap:0;margin:44px 0 36px;border-top:1px solid rgba(255,255,255,.2);border-bottom:1px solid rgba(255,255,255,.2)}
.direct-steps span{position:relative;padding:22px 30px 22px 0;margin-right:30px;color:rgba(255,255,255,.88);font-size:14px}
.direct-steps span:not(:last-child):after{content:'→';position:absolute;right:0;color:rgba(255,255,255,.35)}
.direct-project .button.dark{background:#fff;color:var(--brand);border-color:#fff}

/* DELIVERABLES */
.how-page .how-deliver{padding:128px 0;background:#fafbfa}
.how-page .how-deliver .section-head{margin-bottom:60px}
.how-page .how-deliver-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.how-page .how-deliver-grid a{min-height:178px;padding:30px;border:1px solid #e3e8e5;border-radius:12px;background:#fff;display:flex;flex-direction:column;justify-content:space-between;color:var(--ink);transition:opacity .2s,border-color .2s}
.how-page .how-deliver-grid a:hover{opacity:.72;border-color:#b5c4bc;color:var(--brand)}
.how-page .how-deliver-grid strong{font-size:20px;font-weight:520;line-height:1.45}
.how-page .how-deliver-grid span{color:var(--muted);font-size:16px;line-height:1.7}
.how-page .how-cta{padding:128px 0}
.how-page .how-cta-inner{padding:50px 0;border-top:1px solid #dce4df;border-bottom:1px solid #dce4df;display:flex;justify-content:space-between;align-items:flex-end;gap:48px}
.how-page .how-cta h2{margin:0;max-width:760px;font-size:var(--fs-h2);font-weight:510;line-height:1.3;letter-spacing:-.038em}
.how-page .how-cta p:not(.eyebrow){margin:18px 0 0;color:var(--muted);font-size:16px}
.how-page .how-cta .button{flex:0 0 auto}

@media(max-width:1100px){
 .how-page .how-hero-grid{grid-template-columns:minmax(0,1fr) minmax(300px,.8fr);gap:48px}
 .support-explorer{grid-template-columns:1fr}
 .support-map{min-height:480px}
 .support-center-result{margin-top:34px}
}
@media(max-width:900px){
 .how-page .how-hero-grid,.support-heading,.direct-grid{grid-template-columns:1fr;gap:28px}
 .how-page .how-hero-copy{max-width:720px;padding:0}
 .official-links{grid-template-columns:1fr}
 .support-callout{grid-template-columns:1fr}.support-callout .button{margin-top:4px;width:max-content}
 .how-page .how-deliver-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:760px){
 .how-page .how-hero{padding:96px 0 80px}
 .how-page .how-hero h1{font-size:clamp(32px,9.5vw,40px)}
 .how-page .how-hero-copy p{font-size:16px}
 .support-finder,.support-flow,.direct-project,.how-page .how-deliver,.how-page .how-cta{padding:84px 0}
 .support-heading{margin-bottom:44px}
 .support-map-panel,.support-result-panel{padding:22px 18px}
 .support-map{min-height:450px}
 .support-map svg{inset:20px 28px 36px;width:calc(100% - 56px);height:calc(100% - 56px)}
 .support-province{font-size:12px;padding:6px 9px}
 .support-center-result{padding:22px 18px}
 .support-center-result>strong{font-size:20px}
 .support-actions{display:grid}.support-actions .button{width:100%}
 .official-links a{padding:24px 22px}
 .support-flow .process-row{padding:24px 0}
 .support-callout{margin-top:44px;padding:34px 0}
 .direct-grid>div>p{font-size:16px}
 .direct-steps{display:block}.direct-steps span{display:block;margin:0;padding:14px 0;border-bottom:1px solid rgba(255,255,255,.12)}.direct-steps span:not(:last-child):after{display:none}
 .how-page .how-deliver-grid{grid-template-columns:1fr}
 .how-page .how-cta-inner{display:block;padding:36px 0}.how-page .how-cta .button{margin-top:30px}
}
