/* Design Read: 실제 공개 웹과 범위를 먼저 보고 필요한 제작을 골라 문의한다.
   DESIGN_VARIANCE 7 / MOTION_INTENSITY 7 / VISUAL_DENSITY 5
   Hero: 자료 조각→완성 장면, load/selection, mobile shorter, reduce final state.
   Scope: line draw, viewport once, reduce final state. Feedback: pressed/copy text. */
.hm-menu {--hm-paper:#f9f7f3;--hm-ink:#1c1814;--hm-blue:#7eb5e8;--hm-green:#00704a;background:var(--hm-paper);color:var(--hm-ink)}
.hm-menu-intro{padding-block:66px 30px}.hm-menu-kicker{font-size:12px;font-weight:800;letter-spacing:0;margin-bottom:24px}.hm-menu-intro h1{font-size:clamp(44px,7.4vw,106px);line-height:1.04;letter-spacing:0;margin-bottom:30px;max-width:1100px}.hm-menu-intro h1 em{font-style:normal;color:#00704a}.hm-menu-opening{display:flex;justify-content:space-between;align-items:end;gap:24px}.hm-menu-opening p{margin:0;font-size:clamp(16px,1.6vw,21px)}
.hm-menu-cta{display:inline-flex;justify-content:center;align-items:center;min-height:48px;background:#00704a;color:#fff;padding:13px 21px;text-decoration:none;font-weight:750;font-size:15px;transition:background .2s,transform .2s}.hm-menu-cta:hover{background:#005a3c;transform:translateY(-2px)}.hm-menu-cta:active{transform:translateY(1px)}.hm-menu-cta:focus-visible,.hm-menu button:focus-visible,.hm-menu-contact button:focus-visible{outline:3px solid #7eb5e8;outline-offset:5px}.hm-menu-choices{display:flex;flex-wrap:wrap;gap:8px;margin-top:38px}.hm-menu-choices button{flex:1 1 180px;min-height:58px;padding:12px;border:1px solid #b3ada3;background:transparent;color:#1c1814;text-align:center;font-size:14px;font-weight:750;cursor:pointer;transition:background .2s,color .2s}.hm-menu-choices button[aria-pressed=true]{color:#1c1814;background:#7eb5e8;border-color:#7eb5e8}.hm-menu-choices button[aria-pressed=true]::before{content:'✓ ';}.hm-menu-choices button:hover{background:#e2edf6}.hm-menu-choices[hidden],.hm-menu-controls[hidden],.hm-menu-sheet[hidden],.hm-menu-contact[hidden]{display:none}.hm-menu-static{margin-top:30px}
.hm-menu-stage{background:#1c1814;color:#f9f7f3;overflow:hidden}.hm-menu-stage-top,.hm-menu-stage-bottom{max-width:1440px;margin:auto;display:flex;justify-content:space-between;gap:24px;padding:20px 36px;font-size:12px}.hm-menu-stage-top{border-bottom:1px solid #514b46}.hm-menu-stage-top span:last-child{font-variant-numeric:tabular-nums;white-space:nowrap}.hm-menu-composition{position:relative;min-height:620px;height:min(58vw,780px);max-width:1600px;margin:auto;isolation:isolate;overflow:hidden}.hm-menu-result{position:absolute;inset:6% 12% 10%;margin:0;background:#00704a;overflow:hidden;box-shadow:0 20px 55px #0005;z-index:2;transform-origin:center}.hm-menu-main-image{width:100%;height:100%;object-fit:cover}.hm-menu-result::after{content:'';position:absolute;inset:0;background:linear-gradient(transparent 35%,#000b);pointer-events:none}.hm-menu-result-type{position:absolute;left:5%;right:5%;bottom:8%;z-index:2}.hm-menu-result-type small{font-size:13px;display:block;margin-bottom:18px}.hm-menu-result-type strong{font-size:clamp(38px,5.6vw,82px);line-height:1.07;letter-spacing:0;display:block}.hm-menu-fragment{position:absolute;z-index:3;box-shadow:0 12px 40px #0004;pointer-events:none}.hm-menu-fragment-a{width:21%;height:40%;left:2%;top:10%;transform:translate(-7%,0) rotate(-7deg);border:7px solid #f9f7f3;background:#f9f7f3;color:#1c1814}.hm-menu-fragment-a img{width:100%;height:82%;object-fit:cover}.hm-menu-fragment-a span{font-size:12px;display:block;padding:5px 3px}.hm-menu-fragment-b{right:2%;bottom:9%;width:22%;padding:26px 22px;background:#7eb5e8;color:#1c1814;transform:rotate(6deg)}.hm-menu-fragment-b span{display:block;font-size:12px;margin-bottom:14px}.hm-menu-fragment-b b{font-size:clamp(22px,3.4vw,44px);line-height:1.1;letter-spacing:-.06em}.hm-menu-cutline{position:absolute;bottom:3%;left:20%;right:20%;display:flex;align-items:center;gap:16px;font-size:11px;letter-spacing:.1em}.hm-menu-cutline i{flex:1;height:1px;background:#7eb5e8;transform-origin:left}.hm-menu-stage-bottom{border-top:1px solid #514b46;align-items:center}.hm-menu-stage-bottom p{max-width:670px;margin:0;color:#d5cdc4;font-size:12px}.hm-menu-controls{display:flex;gap:8px;flex-shrink:0}.hm-menu-controls button{min-height:44px;border:1px solid #aaa197;padding:8px 14px;background:transparent;color:#fff;cursor:pointer;font-size:12px}.hm-menu-controls button:hover{background:#403b36}.hm-menu-controls button:disabled{opacity:.6;cursor:default}.hm-menu-browser{display:none}.hm-menu-sheet{height:100%;padding:8%;color:#1c1814;background:#f9f7f3}.hm-menu-sheet small{font-size:12px}.hm-menu-sheet strong{display:block;font-size:clamp(30px,4vw,55px);line-height:1.15;margin:6% 0}.hm-menu-sheet div{display:flex;justify-content:space-between;padding:3% 0;border-top:1px solid #b3ada3;font-size:clamp(13px,1.6vw,21px)}.hm-menu-sheet b{color:#00704a}
.hm-menu-stage[data-hm-scene=page] .hm-menu-result{inset:5% 18% 8%;background:#f9f7f3}.hm-menu-stage[data-hm-scene=page] .hm-menu-browser{display:flex;align-items:center;gap:6px;height:30px;background:#e6e1d9;color:#1c1814;padding:0 12px;font-size:10px}.hm-menu-browser i{width:5px;height:5px;border-radius:50%;background:#78716a}.hm-menu-browser span{margin-left:8px}.hm-menu-stage[data-hm-scene=page] .hm-menu-main-image{height:calc(100% - 30px);object-position:top}.hm-menu-stage[data-hm-scene=page] .hm-menu-result-type{display:none}.hm-menu-stage[data-hm-scene=page] .hm-menu-result::after,.hm-menu-stage[data-hm-scene=document] .hm-menu-result::after,.hm-menu-stage[data-hm-scene=automation] .hm-menu-result::after{display:none}.hm-menu-stage[data-hm-scene=document] .hm-menu-result{inset:5% 30% 10%;background:#eee9df;transform:rotate(-3deg)}.hm-menu-stage[data-hm-scene=document] .hm-menu-main-image{object-fit:contain}.hm-menu-stage[data-hm-scene=document] .hm-menu-result-type{display:none}.hm-menu-stage[data-hm-scene=automation] .hm-menu-result{inset:5% 23% 10%}.hm-menu-stage[data-hm-scene=automation] .hm-menu-main-image,.hm-menu-stage[data-hm-scene=automation] .hm-menu-result-type{display:none}.hm-menu-stage[data-hm-scene=monthly] .hm-menu-result{inset:6% 19% 10%}
.hm-menu-outcome{display:grid;grid-template-columns:1.25fr 1fr;gap:70px;padding-block:65px 85px}.hm-menu-outcome h2{font-size:clamp(30px,4vw,58px);line-height:1.15;margin-bottom:0}.hm-menu-outcome>div:last-child{padding-top:40px}.hm-menu-outcome p:not(.hm-menu-kicker){color:#4a423c}.hm-menu-evidence{display:inline-block;margin:18px 0 0 20px;text-underline-offset:5px;font-size:14px}.hm-menu-scope{border-top:2px solid #00704a;border-bottom:1px solid #c9c3b6;padding:32px 0;margin:32px 0}.hm-menu-scope>span{color:#315947;font-size:13px;display:block;margin-bottom:15px}.hm-menu-scope h3{font-size:clamp(24px,3vw,38px)}.hm-menu-scope p{max-width:760px;color:#4a423c}.hm-menu-contact{padding:22px 0;border-block:1px solid #9bb5d9;margin:26px 0}.hm-menu-contact label{display:block;font-weight:750;margin-bottom:12px}.hm-menu-contact textarea{display:block;width:100%;resize:vertical;padding:14px;border:1px solid #e6e1d9;background:#f9f7f3;color:#1c1814;font-size:14px;line-height:1.6}.hm-menu-contact button{min-height:44px;background:#f9f7f3;color:#1c1814;border:0;padding:10px 15px;margin-top:12px;cursor:pointer;font-weight:750}.hm-menu-contact p{font-size:12px;margin:12px 0 0;color:#fff}
@media(prefers-reduced-motion:no-preference){
 .hm-menu-stage.hm-menu-playing .hm-menu-result{animation:hm-menu-assemble 2.8s cubic-bezier(.22,.7,.12,1) both}
 .hm-menu-stage.hm-menu-playing .hm-menu-fragment-a{animation:hm-menu-slip-a 2.8s cubic-bezier(.22,.7,.12,1) both}
 .hm-menu-stage.hm-menu-playing .hm-menu-fragment-b{animation:hm-menu-slip-b 2.8s cubic-bezier(.22,.7,.12,1) both}
 .hm-menu-stage.hm-menu-playing .hm-menu-result-type strong{animation:hm-menu-type 2.8s cubic-bezier(.22,.7,.12,1) both}
 .hm-menu-stage.hm-menu-playing .hm-menu-cutline i{animation:hm-menu-line 2.8s ease both}
 .hm-menu-stage.hm-menu-paused *{animation-play-state:paused!important}
 .hm-menu-scope.hm-menu-in-view{animation:hm-menu-scope-line .75s ease both}
 @keyframes hm-menu-assemble{0%{transform:translateY(70px) scale(.73) rotate(4deg);clip-path:inset(0 24% 0 24%)}45%{clip-path:inset(0 0 0 0)}100%{transform:translateY(0) scale(1) rotate(0);clip-path:inset(0)}}
 @keyframes hm-menu-slip-a{0%,12%{transform:translate(100%,55%) rotate(-18deg) scale(1.12)}100%{transform:translate(-7%,0) rotate(-7deg)}}
 @keyframes hm-menu-slip-b{0%,20%{transform:translate(-100%,-40%) rotate(-10deg)}100%{transform:rotate(6deg)}}
 @keyframes hm-menu-type{0%,28%{transform:translateY(120%);clip-path:inset(100% 0 0)}72%,100%{transform:translateY(0);clip-path:inset(0)}}
 @keyframes hm-menu-line{0%,40%{transform:scaleX(0)}100%{transform:scaleX(1)}}
 @keyframes hm-menu-scope-line{from{border-top-color:transparent;transform:translateY(12px)}to{border-top-color:#00704a;transform:none}}
}
@media(max-width:760px){.hm-menu-intro{padding-top:40px}.hm-menu-intro h1{font-size:clamp(38px,10.5vw,72px)}.hm-menu-opening{align-items:start;flex-direction:column;gap:18px}.hm-menu-choices{gap:6px;margin-top:26px}.hm-menu-choices button{flex:1 1 42%;font-size:12px;min-height:50px;padding:9px}.hm-menu-stage-top,.hm-menu-stage-bottom{padding:16px;gap:12px}.hm-menu-stage-top{font-size:10px}.hm-menu-composition{min-height:380px;height:85vw;max-height:580px}.hm-menu-result{inset:10% 7% 13%}.hm-menu-fragment-a{width:26%;height:31%;left:1%;top:3%;border-width:4px}.hm-menu-fragment-a span{font-size:9px;padding:3px 0}.hm-menu-fragment-b{width:29%;right:1%;bottom:9%;padding:12px 10px}.hm-menu-fragment-b span{font-size:9px;margin-bottom:8px}.hm-menu-fragment-b b{font-size:22px}.hm-menu-result-type{bottom:12%;left:6%}.hm-menu-result-type strong{font-size:clamp(29px,7.5vw,52px)}.hm-menu-result-type small{font-size:10px;margin-bottom:12px}.hm-menu-cutline{left:15%;right:15%;gap:10px}.hm-menu-stage-bottom{flex-direction:column;align-items:start}.hm-menu-stage-bottom p{font-size:11px}.hm-menu-stage[data-hm-scene=page] .hm-menu-result{inset:10% 9% 13%}.hm-menu-stage[data-hm-scene=document] .hm-menu-result{inset:7% 22% 13%}.hm-menu-stage[data-hm-scene=automation] .hm-menu-result{inset:10% 11% 13%}.hm-menu-stage[data-hm-scene=monthly] .hm-menu-result{inset:10% 10% 13%}.hm-menu-sheet{padding:9%}.hm-menu-sheet strong{font-size:30px}.hm-menu-sheet div{font-size:12px;padding:8px 0}.hm-menu-outcome{grid-template-columns:1fr;gap:24px;padding-block:36px 48px}.hm-menu-outcome>div:last-child{padding-top:0}.hm-menu-evidence{margin-left:0;display:block}.hm-menu-outcome .hm-menu-kicker{margin-bottom:14px}.hm-menu-stage.hm-menu-playing *{animation-duration:2s!important}}
@media(prefers-reduced-motion:reduce){.hm-menu *, .hm-menu-scope{animation:none!important;transition:none!important}.hm-menu-cta:hover,.hm-menu-cta:active{transform:none}.hm-menu-controls{display:none}}

.hm-menu-scope .hm-menu-price{color:#00704a;font-weight:800;font-size:clamp(16px,1.7vw,20px);max-width:900px}

/* Actual web work leads; optional motion examples support the selected scope. */
.hm-menu-intro{padding-block:64px 48px}
.hm-menu-intro h1{font-size:clamp(2.4rem,4.6vw,4.2rem);max-width:1100px;line-height:1.14}
.hm-menu-opening{gap:48px}
.hm-menu-opening p{max-width:660px;font-size:1.05rem;margin:0}
.hm-menu-opening>.hm-menu-cta{font-size:.86rem}
.hm-web-heading{display:flex;align-items:baseline;justify-content:space-between;gap:24px;margin-bottom:24px}
.hm-web-heading h2{font-size:1.15rem;letter-spacing:-.025em;margin:0}
.hm-web-heading p{font-size:.8rem;color:var(--muted);margin:0}
.hm-web-case{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(0,1fr);gap:56px;align-items:start;margin-bottom:80px;scroll-margin-top:24px}
.hm-web-visual{position:relative;margin:0;padding:20px 46px 40px 0;min-width:0}
.hm-web-desktop{display:block;background:#e8e2d7;box-shadow:0 12px 35px #4236271a;overflow:hidden;border:1px solid #c9c3b6}
.hm-web-desktop img{width:100%;height:auto}
.hm-web-mobile{position:absolute;right:0;bottom:48px;width:24%;background:#f9f7f3;border:5px solid #f9f7f3;border-radius:12px;box-shadow:0 8px 24px #42362730;overflow:hidden}
.hm-web-mobile img{width:100%;height:auto}
.hm-web-visual figcaption{position:absolute;bottom:0;left:0;max-width:100%;color:var(--muted);font-size:.72rem}
.hm-web-copy{min-width:0;padding-top:20px}
.hm-web-label{color:var(--blue);font-size:.76rem;font-weight:750;margin-bottom:16px}
.hm-web-copy h3{font-size:clamp(1.9rem,2.7vw,2.6rem);line-height:1.19;margin-bottom:22px}
.hm-web-copy>p:not(.hm-web-label){font-size:.95rem;line-height:1.7;color:#45433e}
.hm-web-facts{margin:24px 0;display:grid;gap:16px}
.hm-web-facts div{display:grid;grid-template-columns:76px minmax(0,1fr);gap:12px}
.hm-web-facts dt{font-size:.76rem;font-weight:750;color:var(--ink)}
.hm-web-facts dd{margin:0;color:#565149;font-size:.83rem;line-height:1.7}
.hm-web-links{display:flex;flex-wrap:wrap;align-items:center;gap:16px 20px}
.hm-web-links .hm-menu-cta{font-size:.84rem;padding:13px 16px}
.hm-web-links .text-link{font-size:.8rem;display:inline-flex;align-items:center;min-height:44px}
.hm-web-case-own{padding-top:48px;border-top:1px solid var(--line)}
.hm-web-delivery{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);column-gap:80px;row-gap:24px;background:var(--paper-soft);padding:48px;margin-bottom:88px}
.hm-web-delivery h2{font-size:clamp(1.75rem,3vw,2.7rem);line-height:1.2;margin:0}
.hm-web-delivery ol{list-style:none;margin:0;padding:0;counter-reset:delivery;display:grid;gap:22px}
.hm-web-delivery li{position:relative;padding-left:36px;counter-increment:delivery}
.hm-web-delivery li::before{content:'0' counter(delivery);position:absolute;left:0;top:2px;font-size:.75rem;color:var(--blue);font-weight:750;font-variant-numeric:tabular-nums}
.hm-web-delivery strong,.hm-web-delivery span{display:block}
.hm-web-delivery strong{font-size:.95rem;margin-bottom:4px}
.hm-web-delivery span{font-size:.85rem;color:#565149}
.hm-web-delivery-note{grid-column:1/-1;margin:8px 0 0;font-size:.8rem;color:#565149;max-width:850px}
.hm-menu-select h2{font-size:clamp(1.8rem,3.5vw,3rem);margin-bottom:24px}
.hm-menu-select .hm-menu-choices{margin-top:0;margin-bottom:0}
.hm-menu .hm-menu-outcome{padding-block:32px 48px;gap:48px}
.hm-menu .hm-menu-outcome h2{font-size:clamp(1.8rem,3vw,2.7rem)}
.hm-menu .hm-menu-outcome>div:last-child{padding-top:20px}
.hm-menu-example{margin-bottom:64px}
.hm-menu-example summary{width:fit-content;min-height:44px;padding:8px 0;color:#565149;cursor:pointer;font-size:.88rem;text-underline-offset:5px}
.hm-menu-example[open] summary{margin-bottom:24px}
.hm-menu-example .hm-menu-stage{width:100%;margin:0}
.hm-menu-stage[data-hm-scene=page] .hm-menu-fragment{display:none}
.hm-menu-stage[data-hm-scene=page] .hm-menu-result{inset:5% 15% 8%}
.hm-menu-stage[data-hm-scene=page] .hm-menu-main-image{object-fit:contain;background:#f9f7f3}
.hm-web-desktop:focus-visible,.hm-web-mobile:focus-visible{outline:3px solid var(--blue);outline-offset:5px}
.hm-web-desktop:hover{box-shadow:0 16px 40px #4236272e}
.hm-menu-choices button{font-size:.875rem}
@media(max-width:1000px){
 .hm-web-case{gap:32px;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
 .hm-web-delivery{column-gap:40px;padding:32px}
}
@media(max-width:760px){
 .hm-menu-intro{padding-block:36px 32px}
 .hm-menu-intro h1{font-size:clamp(2rem,7.7vw,3.5rem);line-height:1.2;margin-bottom:22px}
 .hm-menu-intro h1 br{display:none}
 .hm-menu-intro h1 em{display:block}
 .hm-menu-opening{gap:20px}
 .hm-menu-opening p{font-size:1rem}
 .hm-web-heading{display:block;margin-bottom:16px}
 .hm-web-heading h2{font-size:1rem;margin-bottom:8px}
 .hm-web-heading p{font-size:.78rem}
 .hm-web-case{grid-template-columns:1fr;gap:28px;margin-bottom:56px}
 .hm-web-visual{padding:0 30px 36px 0}
 .hm-web-mobile{width:23%;border-width:3px;border-radius:8px;bottom:40px}
 .hm-web-copy{padding-top:0}
 .hm-web-copy h3{font-size:2rem;line-height:1.2;margin-bottom:20px}
 .hm-web-copy h3 br{display:none}
 .hm-web-facts div{grid-template-columns:72px minmax(0,1fr);gap:12px}
 .hm-web-case-own{padding-top:32px}
 .hm-web-delivery{grid-template-columns:1fr;padding:28px 20px;gap:28px;margin-bottom:56px}
 .hm-web-delivery h2{font-size:2rem}
 .hm-web-delivery h2 br{display:none}
 .hm-web-delivery-note{margin:0}
 .hm-menu .hm-menu-outcome{gap:20px;padding-block:28px 32px}
 .hm-menu .hm-menu-outcome>div:last-child{padding-top:0}
 .hm-menu-example{margin-bottom:40px}
 .hm-menu-stage[data-hm-scene=page] .hm-menu-result{inset:8% 4% 12%}
 .hm-web-visual figcaption{font-size:.68rem}
}

/* Keep the existing header legible when text is enlarged. */
.masthead .shell,.nav{flex-wrap:wrap}
.masthead .brand,.nav .contact-link{white-space:nowrap}