@font-face{font-family:'MI Sans';src:url('assets/fonts/Pretendard-SemiBold.woff2') format('woff2');font-style:normal;font-weight:600;font-display:swap}
/* SERVICE four-card menu and detail popup; shared fonts/header/footer preserved. */
@font-face {font-family:"MI Service Myeongjo";src:url('assets/fonts/NanumMyeongjo-Regular.ttf') format('truetype');font-weight:400;font-style:normal;font-display:swap}
.service-page {--green:#064b16}
.service-page .brand-stage {height:calc(13.7 * var(--layout-unit))}
.service-page .brand {top:calc(3.1 * var(--layout-unit))}
.service-page .navigation {height:calc(3.45 * var(--layout-unit));margin-inline:var(--page-gutter);border-color:#b5bcc6}
.service-main {margin:0 var(--page-gutter) clamp(40px,calc(4 * var(--layout-unit)),56px)}
.service-intro {padding:clamp(52px,calc(4.5 * var(--layout-unit)),64px) 20px clamp(36px,calc(3.7 * var(--layout-unit)),52px);text-align:center;border-bottom:1px solid var(--block-rule)}
.service-title {margin:0;font-family:var(--serif);font-size:var(--type-title);font-weight:400;line-height:1.2}
.service-description {margin:20px 0 0;font-size:var(--type-body);line-height:1.8;letter-spacing:-.025em;word-break:keep-all;overflow-wrap:break-word}
.service-description>span,.service-lead {display:block}
.service-lead {color:var(--green);font-size:calc(var(--type-body) * 1.15);font-weight:700;line-height:1.8}
.service-categories {padding:clamp(54px,calc(6 * var(--layout-unit)),82px) clamp(0px,calc(1.1 * var(--layout-unit)),15px) clamp(62px,calc(6.5 * var(--layout-unit)),90px);border-bottom:1px solid var(--block-rule)}
.service-grid {list-style:none;width:min(100%,920px);margin:0 auto;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(14px,calc(1.6 * var(--layout-unit)),24px)}
.service-card-item {min-width:0}
.service-card {position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;width:100%;min-height:clamp(210px,calc(19.5 * var(--layout-unit)),260px);padding:32px 22px;border:1px solid #d7dcd6;border-radius:0;background:#f5f5f2;color:var(--ink);text-align:center;cursor:pointer;overflow:hidden;transition:border-color .25s ease,background-color .25s ease;appearance:none}
.service-card-number {font-family:var(--serif);font-size:var(--type-eyebrow);letter-spacing:.14em;line-height:1.4;color:var(--green);margin-bottom:22px}
.service-card-title {font-family:var(--sans);font-weight:600;font-synthesis:none;font-size:var(--type-subtitle);line-height:1.4;letter-spacing:-.035em;word-break:keep-all}
.service-card-tagline {color:var(--green);font-size:var(--type-body);line-height:1.6;letter-spacing:-.025em;margin-top:14px;word-break:keep-all}
.service-card-overlay {position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:rgba(6,75,22,.89);color:#fff;opacity:0;visibility:hidden;transform:translateY(6px);transition:opacity .28s ease,transform .28s ease,visibility 0s linear .28s}
.service-card-overlay>span {display:inline-flex;align-items:center;gap:13px;font-size:var(--type-body);letter-spacing:-.02em;border-bottom:1px solid rgba(255,255,255,.8);padding-bottom:9px}
.service-card-arrow {font-size:1.2em;font-weight:400}
.service-card:hover,.service-card:focus-visible {border-color:var(--green)}
@media(hover:hover) {
 .service-card:hover .service-card-overlay {opacity:1;visibility:visible;transform:translateY(0);transition-delay:0s}
}
.service-card:focus-visible .service-card-overlay {opacity:1;visibility:visible;transform:translateY(0);transition-delay:0s}
html.service-dialog-open {overflow:hidden;scrollbar-gutter:stable}
.service-dialog {width:min(740px,calc(100vw - 48px));max-width:none;max-height:calc(100dvh - 48px);margin:auto;padding:0;border:1px solid var(--block-rule);border-radius:0;background:#fff;color:var(--ink);font-family:var(--sans);overflow:auto;overscroll-behavior:contain;box-shadow:0 25px 90px rgba(0,0,0,.22)}
.service-dialog:not([open]) {display:none}
.service-dialog::backdrop {background:rgba(0,0,0,.72)}
.service-dialog-toolbar {display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:62px;padding:8px 24px;background:#fff;border-bottom:1px solid #e3e7e1}
.service-dialog-number {color:var(--green);font-family:var(--serif);font-size:14px;letter-spacing:.12em}
.service-dialog-close {display:flex;align-items:center;justify-content:center;gap:7px;min-width:66px;min-height:44px;padding:8px;background:transparent;border:0;font-size:13px;cursor:pointer}
.service-dialog-close svg {width:20px;height:20px}
.service-dialog-close:hover,.service-dialog-close:focus-visible {color:var(--green)}
.service-dialog-body {padding:clamp(28px,calc(4.5 * var(--layout-unit)),56px) clamp(26px,calc(5 * var(--layout-unit)),60px) clamp(36px,calc(5.5 * var(--layout-unit)),70px)}
.service-dialog-title {margin:0;font-family:var(--sans);font-size:var(--type-subtitle);font-weight:600;font-synthesis:none;line-height:1.45;word-break:keep-all}
.service-dialog-tagline {margin:14px 0 0;color:var(--green);font-size:var(--type-body);line-height:1.7}
.service-dialog-copy {margin-top:32px;padding-top:26px;border-top:1px solid var(--block-rule);font-size:var(--type-body);line-height:1.9;letter-spacing:-.025em;color:#4a4a4a;word-break:keep-all;overflow-wrap:break-word}
.service-dialog-copy p {margin:0}
.service-dialog-copy p+p {margin-top:16px}
@media(max-width:700px) {
 .service-page .brand-stage {height:130px}
 .service-page .brand {top:27px}
 .service-page .brand-symbol {width:66px}
 .service-page .brand-name {margin-top:8px}
 .service-page .navigation {height:37px}
 .service-intro {padding:56px 0 48px}
 .service-description {margin-top:20px}
 .service-lead {font-size:var(--type-body)}
 .service-categories {padding:48px 0 58px}
 .service-card {min-height:210px;padding:26px 12px}
 .service-card-number {margin-bottom:17px}
 .service-card-tagline {font-size:14px;margin-top:12px}
 .service-dialog {width:calc(100vw - 24px);max-height:calc(100dvh - 24px)}
 .service-dialog-toolbar {min-height:55px;padding:6px 16px}
 .service-dialog-body {padding:28px 24px 38px}
 .service-dialog-copy {margin-top:24px;padding-top:20px}
}
@media(max-width:600px) {
 .service-grid {max-width:440px;grid-template-columns:1fr;gap:14px}
 .service-card {min-height:190px}
}
@media(prefers-reduced-motion:reduce) {
 .service-card,.service-card-overlay {transition:none!important}
}
