@font-face{font-family:Pretendard;src:url('/fonts/PretendardVariable.woff2') format('woff2');font-style:normal;font-weight:45 920;font-display:swap}
:root{--green:#244A3C;--green-dark:#19392D;--paper:#F7F8F4;--tint:#EEF3EC;--ink:#202B26;--muted:#526258;--line:#D7DFD5;--control:#7A897D;--gutter:40px;--section:72px;--column-gap:48px}
*{box-sizing:border-box}
html{scrollbar-gutter:stable;scroll-padding-block:96px 90px}
body{margin:0;background:var(--paper);color:var(--ink);font-family:Pretendard,-apple-system,BlinkMacSystemFont,'Apple SD Gothic Neo','Malgun Gothic',sans-serif;font-size:18px;line-height:1.75;word-break:keep-all;overflow-wrap:break-word}
body.modal-open{overflow:hidden}
h1,h2,h3,p,figure,ol,ul{margin:0}
h1,h2{font-weight:700}
h2{font-size:36px;line-height:1.35;letter-spacing:-.025em}
h3{font-size:24px;line-height:1.45;font-weight:650;letter-spacing:-.015em}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;cursor:pointer;border-radius:0}
button,a{-webkit-tap-highlight-color:transparent}
a,button,summary{scroll-margin-block:96px 90px}
img{display:block;max-width:100%;height:auto}
svg{flex:none}
[hidden]{display:none!important}
:focus-visible{outline:3px solid var(--green);outline-offset:3px}
.container{max-width:1200px;padding-inline:var(--gutter);margin-inline:auto;min-width:0}
.section{padding-block:var(--section)}
.intro{max-width:660px;color:var(--muted);margin-top:16px}
.section-heading{margin-bottom:32px}
.muted{color:var(--muted)}
.sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip-link{position:fixed;left:16px;top:8px;transform:translateY(-160%);z-index:120;background:white;padding:12px 20px}
.skip-link:focus{transform:none}
.preview-notice{background:var(--tint);color:var(--green);font-size:13px;text-align:center;padding:6px 16px;line-height:1.5}
.header{position:sticky;top:0;z-index:30;background:var(--paper);border-bottom:1px solid var(--line)}
.header-inner{min-height:80px;display:flex;align-items:center;justify-content:space-between;gap:16px}
.logo{display:inline-flex;align-items:center;gap:12px;flex-shrink:0;font-size:23px;font-weight:730;line-height:1.25;letter-spacing:-.045em}
.logo-name{font-family:Pretendard,-apple-system,BlinkMacSystemFont,'Apple SD Gothic Neo','Malgun Gothic',sans-serif}
.seal{width:34px;height:34px;display:flex;align-items:center;justify-content:center;flex:none;background:var(--green);color:white;font-family:'AppleMyungjo',Batang,serif;font-size:20px;line-height:1;font-weight:700}
.header-phone{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;color:var(--green);font-size:18px;font-weight:650;white-space:nowrap}
.utility-bar{border-bottom:1px solid var(--line)}
.utility-inner{display:flex;align-items:center;justify-content:space-between;gap:24px;padding-block:10px;min-height:68px}
.breadcrumb,.breadcrumb-home{font-size:14px;color:var(--muted);line-height:1.6}
.breadcrumb{display:flex;align-items:center;flex-wrap:wrap;gap:8px}
.breadcrumb a{text-decoration:underline;text-underline-offset:4px}
.separator{color:var(--green)}
.region-trigger{background:none;border:1px solid var(--control);min-height:48px;padding:10px 16px;display:inline-flex;align-items:center;justify-content:space-between;gap:24px;font-size:16px;font-weight:600;flex-shrink:0;border-radius:4px}
.region-trigger:hover{background:var(--tint)}
.region-chevron{display:block;width:16px;height:16px;flex:none;color:var(--green)}

/* Hero uses the full title width; its lower row balances information and the call. */
.hero{padding-block:60px 64px}
.eyebrow{font-size:14px;font-weight:650;line-height:1.6;color:var(--green);margin-bottom:20px}
.eyebrow-region{color:var(--muted)}
.hero h1{font-size:64px;line-height:1.28;letter-spacing:-.015em}
.hero h1 span,.contact h2 span{display:block}
.hero-details{display:grid;grid-template-columns:minmax(0,1fr) 328px;gap:56px;margin-top:32px;align-items:start}
.hero-copy{max-width:660px}
.hero-lead{font-size:22px;line-height:1.6;font-weight:550}
.hero-description{margin-top:14px;color:var(--muted)}
.hero-consult{padding-left:28px;border-left:1px solid var(--control)}
.button{display:inline-flex;align-items:center;justify-content:center;gap:12px;background:var(--green);color:white;min-height:56px;border-radius:4px;padding:16px 24px;font-size:18px;font-weight:650;line-height:1.4}
.button:hover{background:var(--green-dark)}
.hero-consult .button{width:100%}
.hero-note{font-size:16px;line-height:1.65;color:var(--muted);margin-top:14px}

.situations{background:white}
.situation-heading{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--column-gap);align-items:start;margin-bottom:36px}
.situation-heading .intro{margin-top:0}
.situation-list{border-top:2px solid var(--green)}
.situation-copy{display:grid;grid-template-columns:320px minmax(0,1fr);gap:48px;padding-block:28px;border-bottom:1px solid var(--line)}
.situation-copy h3{max-width:none}
.situation-copy p{color:var(--muted);max-width:660px}
.situation-action{padding-top:20px}
.text-link{display:inline-flex;align-items:center;gap:10px;min-height:48px;font-size:16px;line-height:1.6;font-weight:650;color:var(--green);text-decoration:underline;text-underline-offset:6px;text-decoration-thickness:1px}
.text-link:hover{color:var(--green-dark)}

.process .section-heading,.field-cases .section-heading{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--column-gap);align-items:start}
.process .section-heading .intro,.field-cases .section-heading .intro{margin-top:0}
.steps{list-style:none;padding:0;border-top:1px solid var(--control);border-bottom:1px solid var(--control)}
.steps li{position:relative;display:grid;grid-template-columns:80px 280px minmax(0,1fr);column-gap:32px;padding-block:28px;align-items:start}
.steps li:not(:last-child):before{content:'';position:absolute;left:23px;top:104px;bottom:-16px;border-left:1px solid var(--control)}
.step-number{display:flex;flex-direction:column;align-items:flex-start;color:var(--green);font-variant-numeric:tabular-nums;line-height:1}
.step-label{font-size:12px;font-weight:650;letter-spacing:.08em;margin-bottom:7px}
.step-value{font-size:44px;font-weight:600;letter-spacing:-.03em}
.steps h3{padding-top:16px}
.steps p{color:var(--muted);max-width:660px;padding-top:12px}
.step-content{min-width:0}
.process-note{font-size:16px;line-height:1.65;color:var(--muted);max-width:840px;margin-top:24px;padding-left:18px;border-left:2px solid var(--control)}

/* Scene records share one section; no photographs imply completed work elsewhere. */
.field-cases{background:white;border-bottom:1px solid var(--line)}
.case-source{font-size:14px;line-height:1.6;color:var(--green);margin-bottom:24px}
.case-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:40px 48px}
.case-entry{min-width:0;padding-bottom:28px;border-bottom:1px solid var(--line)}
.case-photo img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover}
.case-copy{margin-top:20px}
.case-copy h3{font-size:26px;line-height:1.45}
.case-copy p{color:var(--muted);margin-top:14px;max-width:600px}
.case-note{font-size:14px;line-height:1.65;color:var(--muted);margin-top:24px}

/* Every section shares the container edge, including the FAQ heading. */
.faq{background:white}
.faq-layout,.region-layout{display:grid;grid-template-columns:320px minmax(0,1fr);gap:var(--column-gap);align-items:start}
.faq-list{border-top:1px solid var(--control);min-width:0}
details{border-bottom:1px solid var(--line)}
summary{list-style:none;cursor:pointer;display:flex;align-items:baseline;justify-content:space-between;gap:24px;padding:20px 0;font-size:19px;font-weight:650;line-height:1.55}
summary::-webkit-details-marker{display:none}
.faq-indicator{position:relative;width:20px;height:20px;flex:none;align-self:flex-start;margin-top:5px;color:var(--green)}
.faq-indicator:before,.faq-indicator:after{content:'';position:absolute;background:currentColor;left:3px;right:3px;top:9px;height:2px}
.faq-indicator:after{transform:rotate(90deg)}
details[open] .faq-indicator:after{display:none}
.answer{padding:0 36px 22px 0;color:var(--muted)}
.answer p{max-width:660px}

.regions{background:var(--tint);padding-block:64px}
.region-note{max-width:660px;color:var(--muted);font-size:16px;margin-top:12px}
.region-label{font-size:18px;margin-bottom:12px}
.region-context{font-size:16px;margin-bottom:16px}
.preview-region-note,.region-help{font-size:14px;line-height:1.65;color:var(--muted);margin-block:0 20px;max-width:660px}
.region-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.region-grid.cities{grid-template-columns:repeat(4,minmax(0,1fr))}
.region-item{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;min-height:52px;padding:12px 8px;border:1px solid var(--control);background:white;font-size:16px;line-height:1.5;font-weight:550;min-width:0;border-radius:4px}
.region-item:hover:not(.unavailable){color:var(--green);background:var(--paper)}
.province-button{flex-direction:row;justify-content:space-between;padding-inline:16px;text-align:left}
.province-button .region-chevron{color:var(--green)}
.region-item.current,.province-choice[aria-pressed=true]{background:var(--green);color:white;font-weight:700;border-color:var(--green)}
.region-item.current:hover{background:var(--green-dark);color:white}
.unavailable{background:var(--paper);border-color:var(--line);color:var(--muted);cursor:default}
.unavailable small{font-size:12px;line-height:1.5;margin-top:2px}
.demo-region-link{margin-top:16px}
.other-region{margin-top:16px;margin-left:24px;border:0;padding:0;background:none;text-decoration:none}
.other-region .region-trigger-label{text-decoration:underline;text-underline-offset:6px;text-decoration-thickness:1px}

.contact{background:var(--green);color:white;padding-block:64px}
.contact-layout{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:48px}
.contact h2{font-size:36px;line-height:1.4;letter-spacing:-.01em}
.contact-intro{max-width:480px;margin-top:24px}
.contact-details{border-left:1px solid var(--control);padding-left:32px}
.contact h3{font-size:18px;line-height:1.6}
.contact ul{padding-left:20px;margin-top:16px}
.contact li{padding-left:4px;margin-top:10px}
.contact-note{font-size:16px;margin-top:16px}
.button-light{background:white;color:var(--green);margin-top:24px;width:100%;font-size:20px;min-height:60px}
.button-light:hover{background:var(--tint)}
.contact-brand{font-size:14px;margin-top:16px}
.contact :focus-visible{outline-color:white}
.footer{padding-block:32px 40px;border-top:1px solid var(--line);background:var(--paper)}
.footer p{font-size:14px;color:var(--muted);margin-top:12px}
.footer-business{display:flex;flex-wrap:wrap;gap:4px 12px}
.footer-business>span{display:inline-flex;align-items:baseline;gap:12px}
.footer-business>span+span:before{content:'·'}
.footer-business a{text-decoration:underline;text-underline-offset:3px}
.sticky-phone{display:none}

dialog{padding:0;border:1px solid var(--line);border-radius:4px;width:min(720px,calc(100% - 48px));max-height:80dvh;background:var(--paper);color:var(--ink);overflow:hidden}
dialog::backdrop{background:rgb(25 41 31 / .55)}
.dialog-header{display:flex;align-items:center;justify-content:space-between;padding:20px 32px;border-bottom:1px solid var(--line);gap:16px}
.dialog-header h2{font-size:24px;line-height:1.4}
.icon-button{display:flex;align-items:center;justify-content:center;min-width:48px;min-height:48px;border:0;background:none;font-size:32px;line-height:1;color:var(--green)}
.dialog-body{padding:24px 32px 32px;overflow-y:auto;max-height:calc(80dvh - 90px);overscroll-behavior:contain}
.province-label{font-size:16px;margin-bottom:16px}
.province-panel{margin-top:32px;padding-top:24px;border-top:1px solid var(--line)}
.province-panel h3{font-size:20px;margin-bottom:20px}
.province-panel .text-link{margin-bottom:20px}

/* Icon colors only; Hero phone keeps its existing inherited color. */
.header-phone svg,.situation-action .text-link svg,.contact .button-light svg,.icon-button>span,.demo-region-link>span[aria-hidden]{color:var(--green)}
.header-phone svg,.situation-action .text-link svg,.contact .button-light svg,.sticky-phone svg{fill:currentColor;stroke:none}
.header-phone:is(:hover,:active,:focus-visible) svg,
.situation-action .text-link:is(:hover,:active,:focus-visible) svg,
.contact .button-light:is(:hover,:active,:focus-visible) svg,
[data-open-region]:is(:hover,:active,:focus-visible) .region-chevron,
.icon-button:is(:hover,:active,:focus-visible)>span,
.demo-region-link:is(:hover,:active,:focus-visible)>span[aria-hidden],
summary:is(:hover,:active,:focus-visible) .faq-indicator{color:var(--green-dark)}
.sticky-phone svg{color:white}

@media(min-width:1024px) and (max-width:1199px){
  .hero h1{font-size:58px}.hero-details{grid-template-columns:minmax(0,1fr) 300px;gap:32px}
  .hero-consult{padding-left:24px}.hero-lead{font-size:20px}
  .situation-copy{grid-template-columns:280px minmax(0,1fr);gap:32px}
  .steps li{grid-template-columns:64px 240px minmax(0,1fr);column-gap:24px}
  .faq-layout,.region-layout{grid-template-columns:280px minmax(0,1fr);gap:32px}
}
@media(max-width:1023px){
  :root{--gutter:32px;--section:64px;--column-gap:32px}
  body{padding-bottom:calc(80px + env(safe-area-inset-bottom,0px))}
  h2{font-size:32px}h3{font-size:22px}
  .hero{padding-block:48px 52px}.hero h1{font-size:48px}.hero-details{grid-template-columns:minmax(0,1fr) 260px;gap:28px;margin-top:28px}
  .hero-lead{font-size:20px}.hero-consult{padding-left:24px}.hero-consult .button{font-size:17px;padding-inline:16px}
  .situation-heading{grid-template-columns:1fr;gap:16px}.situation-heading .intro{max-width:660px}
  .situation-copy{grid-template-columns:240px minmax(0,1fr);gap:32px}
  .process .section-heading,.field-cases .section-heading{grid-template-columns:1fr;gap:16px}
  .case-list{gap:32px}
  .case-copy h3{font-size:23px}
  .steps li{grid-template-columns:64px minmax(0,1fr);column-gap:24px;row-gap:8px;padding-block:24px}
  .step-number{grid-row:1 / span 2}.steps h3{padding-top:0}.steps p{grid-column:2;padding-top:0}
  .step-content{grid-column:2}
  .steps li:not(:last-child):before{top:100px;bottom:-12px}
  .faq-layout,.region-layout{grid-template-columns:1fr;gap:28px}.faq-layout h2{max-width:660px}
  .region-heading{max-width:660px}.regions{padding-block:56px}
  .contact{padding-block:56px}.contact-layout{gap:32px}.contact h2{font-size:32px}.contact-details{padding-left:24px}
  .sticky-phone{position:fixed;z-index:40;bottom:0;left:0;right:0;display:flex;align-items:center;justify-content:center;gap:10px;min-height:calc(64px + env(safe-area-inset-bottom,0px));padding:16px 20px calc(16px + env(safe-area-inset-bottom,0px));background:var(--green);color:white;font-size:17px;font-weight:650;line-height:1.5}
  .sticky-phone:focus-visible{outline-color:white;outline-offset:-5px}
}
@media(max-width:767px){
  :root{--gutter:20px;--section:44px;--column-gap:24px}
  body{font-size:17px}
  h2{font-size:28px;line-height:1.35}h3{font-size:21px}
  .header-inner{min-height:60px;gap:12px;padding-block:8px}.logo{font-size:20px;gap:9px;letter-spacing:-.04em}.seal{width:30px;height:30px;font-size:18px}
  .header .logo{font-size:18px;font-weight:700;gap:8px;letter-spacing:-.03em;white-space:nowrap}.header .seal{width:28px;height:28px;font-size:17px}
  .header-phone{min-width:44px;min-height:44px;gap:0}.header-phone span{display:none}.header-phone svg{width:20px;height:20px;fill:currentColor;stroke:none}
  .utility-inner{column-gap:12px;row-gap:4px;flex-wrap:wrap;padding-block:8px;min-height:60px}.region-trigger{min-height:44px;gap:6px;font-size:13px;line-height:1.5;padding:4px 10px;max-width:100%}.region-trigger .region-chevron{width:14px;height:14px}
  .breadcrumb,.breadcrumb-home{line-height:1.5}.breadcrumb{flex:1 1 160px;min-width:0;gap:4px}
  .hero{padding-block:32px 40px}.eyebrow{margin-bottom:16px}.hero h1{font-size:36px;line-height:1.3;letter-spacing:-.015em}
  .hero-details{grid-template-columns:1fr;gap:24px;margin-top:20px}.hero-lead{font-size:18px;line-height:1.6}.hero-description{margin-top:12px}
  .hero-consult{padding-left:0;border-left:0}.hero-note{margin-top:12px}.hero-consult .button{font-size:17px}
  .button{font-size:17px;padding:16px 20px;width:100%}
  .section-heading{margin-bottom:24px}
  .situation-heading{gap:12px;margin-bottom:24px}
  .situation-copy{grid-template-columns:1fr;gap:12px;padding-block:24px}
  .situation-action{padding-top:16px}.situation-action .text-link{font-size:16px}
  .process .section-heading,.field-cases .section-heading{gap:12px}
  .case-source{margin-bottom:20px}.case-list{grid-template-columns:1fr;gap:32px}
  .case-photo img{aspect-ratio:auto;object-fit:contain}
  .case-copy{margin-top:18px}
  .case-copy h3{font-size:22px}.case-copy p{margin-top:10px}
  .case-note{margin-top:24px}
  .steps li{grid-template-columns:48px minmax(0,1fr);column-gap:16px;row-gap:8px;padding-block:24px}
  .step-label{font-size:10px;margin-bottom:6px}.step-value{font-size:36px}.steps li:not(:last-child):before{left:18px;top:90px;bottom:-10px}
  .steps h3{font-size:21px}.process-note{margin-top:20px;padding-left:14px}
  .faq-layout,.region-layout{gap:24px}.faq-layout h2{max-width:340px}
  summary{font-size:17px;gap:16px;padding-block:18px}.answer{padding-right:0;padding-bottom:20px}
  .regions{padding-block:44px}.region-grid,.region-grid.cities{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .region-item{min-height:52px}.province-button{padding-inline:14px}.region-label{font-size:17px}
  .other-region{display:flex;margin-left:0;margin-top:12px}
  .contact{padding-block:44px}.contact-layout{grid-template-columns:1fr;gap:24px}.contact h2{font-size:28px}.contact-intro{margin-top:16px}
  .contact-details{border-left:0;border-top:1px solid var(--control);padding-left:0;padding-top:24px}
  .contact li{margin-top:10px}.button-light{font-size:19px}.contact-brand{margin-top:16px}
  .footer{padding-block:28px 32px}
  .footer-business{flex-direction:column;align-items:flex-start;gap:4px}
  .footer-business>span+span:before{display:none}
  dialog{width:100%;max-width:none;max-height:88dvh;margin:auto 0 0;border-radius:8px 8px 0 0}
  .dialog-header{padding:14px 20px}.dialog-header h2{font-size:22px}
  .dialog-body{padding:20px 20px calc(32px + env(safe-area-inset-bottom,0px));max-height:calc(88dvh - 80px)}
  .province-panel{margin-top:24px}.dialog-body .region-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:359px){
  :root{--gutter:16px}.hero h1{font-size:32px}.logo{font-size:19px;gap:8px}
  .steps li{column-gap:12px}
}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}
@media(max-height:450px){.sticky-phone{position:static}.header{position:static}body{padding-bottom:0}}
