@import url("https://fonts.googleapis.com/css2?family=Gowun+Batang:wght@700&family=Noto+Sans+KR:wght@400;500;600;700;800&display=swap");

:root { --forest: #14362f; --forest-light: #24584d; --ink: #17231f; --coral: #e86f51; --paper: #f5f3ec; --mist: #dce6df; --white: #fff; --muted: #68736e; --line: rgba(23,35,31,.16); }
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--ink); background: var(--paper); font-family: "Noto Sans KR", sans-serif; line-height: 1.7; word-break: keep-all; }
a { color: inherit; text-decoration: none; }
.region-header { display: flex; height: 76px; align-items: center; gap: 32px; padding: 0 clamp(22px,6vw,88px); border-bottom: 1px solid var(--line); background: var(--paper); }
.brand { display: inline-flex; align-items: center; gap: 10px; font-weight: 800; }
.brand-mark { display: grid; width: 38px; height: 38px; place-items: center; border: 1px solid var(--forest); font: 26px Georgia,serif; }
.area-home { border-bottom: 2px solid var(--coral); padding: 7px 0; font-size: 13px; font-weight: 700; }
.header-phone { margin-left: auto; padding: 10px 17px; color: var(--white); background: var(--forest); font-size: 13px; font-weight: 700; }
.region-hero { position: relative; display: flex; min-height: 570px; flex-direction: column; justify-content: center; overflow: hidden; padding: 90px clamp(24px,9vw,145px); color: var(--white); background: linear-gradient(90deg,rgba(10,39,33,.96),rgba(17,58,49,.48)),url("https://images.unsplash.com/photo-1509062522246-3755977927d7?auto=format&fit=crop&w=2000&q=86") center/cover; }
.region-hero::after { position: absolute; right: 3vw; bottom: -4vw; color: rgba(255,255,255,.07); content: attr(data-region); font: 700 clamp(100px,17vw,250px)/1 "Gowun Batang",serif; white-space: nowrap; }
.eyebrow,.section-label { margin: 0 0 18px; color: #ff9a7e; font-size: 11px; font-weight: 800; letter-spacing: .16em; }
.region-hero h1 { max-width: 920px; margin: 0; font: 700 clamp(42px,6vw,78px)/1.28 "Gowun Batang",serif; }
.region-hero h1 em { color: #ff9a7e; font-style: normal; }
.region-hero > p:not(.eyebrow) { max-width: 650px; margin: 26px 0 0; color: rgba(255,255,255,.8); font-size: 16px; }
.hero-actions { position: relative; z-index: 1; display: flex; align-items: center; gap: 24px; margin-top: 36px; }
.button { display: inline-flex; min-height: 55px; align-items: center; justify-content: center; padding: 0 25px; color: var(--white); background: var(--coral); font-weight: 800; }
.text-link { border-bottom: 1px solid rgba(255,255,255,.6); font-size: 13px; }
.region-content { padding: 100px clamp(24px,9vw,145px); }
.intro { display: grid; grid-template-columns: .9fr 1.1fr; gap: 8vw; }
.intro h2,.area-section h2,.region-cta h2 { margin: 0; font: 700 clamp(34px,4vw,55px)/1.4 "Gowun Batang",serif; }
.intro-copy { margin: 4px 0 0; color: var(--muted); }
.feature-grid { display: grid; grid-template-columns: repeat(3,1fr); margin-top: 70px; border-block: 1px solid var(--line); }
.feature-grid article { min-height: 230px; padding: 30px; }
.feature-grid article+article { border-left: 1px solid var(--line); }
.feature-grid span { color: var(--coral); font-size: 10px; font-weight: 800; }
.feature-grid h3 { margin: 42px 0 12px; font: 700 23px "Gowun Batang",serif; }
.feature-grid p { margin: 0; color: var(--muted); font-size: 14px; }
.transition-section { padding: 75px clamp(24px,9vw,145px); border-top: 1px solid var(--line); background: var(--mist); }
.transition-section h2 { margin: 0; font: 700 clamp(30px,3.5vw,48px)/1.4 "Gowun Batang",serif; }
.transition-keywords { margin: 25px 0 10px; color: #b94b34; font-size: 15px; font-weight: 800; }
.transition-copy { max-width: 760px; margin: 0; color: var(--muted); font-size: 14px; }
.area-section { padding: 90px clamp(24px,9vw,145px); color: var(--white); background: var(--forest-light); }
.area-list { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 34px; }
.area-list a { padding: 11px 15px; border: 1px solid rgba(255,255,255,.34); font-size: 13px; }
.area-list a:hover,.area-list a[aria-current="page"] { color: var(--forest); border-color: var(--white); background: var(--white); }
.region-cta { padding: 90px 24px; text-align: center; background: var(--mist); }
.region-cta .button { margin-top: 26px; }
.region-footer { display: flex; justify-content: space-between; gap: 30px; padding: 38px clamp(24px,6vw,88px); color: rgba(255,255,255,.6); background: #09241e; font-size: 11px; }
.floating-phone { display: none; }
@media (max-width:720px) { .region-header { height: 66px; padding: 0 18px; } .brand { font-size: 14px; } .brand-mark { width: 35px; height: 35px; } .area-home { margin-left: auto; } .header-phone { display: none; } .region-hero { min-height: 620px; padding: 80px 22px 120px; } .region-hero h1 { font-size: 40px; } .hero-actions { align-items: flex-start; flex-direction: column; } .intro { grid-template-columns: 1fr; gap: 30px; } .region-content,.area-section,.transition-section { padding: 75px 22px; } .transition-keywords { line-height: 1.9; } .feature-grid { grid-template-columns: 1fr; margin-top: 48px; } .feature-grid article { min-height: 0; padding: 27px 0; } .feature-grid article+article { border-top: 1px solid var(--line); border-left: 0; } .feature-grid h3 { margin-top: 18px; } .region-footer { flex-direction: column; padding-bottom: 90px; } .floating-phone { position: fixed; z-index: 10; right: 14px; bottom: 14px; left: 14px; display: flex; height: 54px; align-items: center; justify-content: center; color: var(--white); background: var(--coral); box-shadow: 0 8px 24px rgba(0,0,0,.24); font-weight: 800; } }