:root {
  --pink: #ff6b84;
  --pink-hover: #ff8398;
  --pink-deep: #b51f4a;
  --pink-soft: #fff5f3;
  --pink-pale: #fff7f5;
  --rose-line: rgba(38, 36, 43, .12);
  --ink: #26242b;
  --text: #565259;
  --muted: #66616a;
  --surface: #ffffff;
  --surface-alt: #fff7f5;
  --footer: #221f28;
  --page: min(1180px, calc(100vw - 48px));
  --header-h: 76px;
  --radius: 16px;
  --shadow: 0 20px 50px rgba(38, 36, 43, .12);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 90px; }
body {
  margin: 0;
  min-width: 320px;
  overflow-x: hidden;
  background: var(--surface);
  color: var(--ink);
  font-family: "Pretendard", -apple-system, BlinkMacSystemFont, "Apple SD Gothic Neo", "Malgun Gothic", "Segoe UI", sans-serif;
  font-size: 17px;
  line-height: 1.78;
  letter-spacing: -.018em;
  word-break: keep-all;
  -webkit-font-smoothing: antialiased;
}
body.menu-open { overflow: hidden; }
a { color: inherit; text-decoration: none; }
img { display: block; width: 100%; height: auto; }
button { font: inherit; }
h1, h2, h3, p { margin-top: 0; }
h1, h2, h3 { color: var(--ink); line-height: 1.24; letter-spacing: -.045em; }
h1 { font-size: clamp(38px, 5.5vw, 76px); }
h2 { font-size: clamp(28px, 3.8vw, 48px); }
h3 { font-size: 21px; }
p { color: var(--text); }
::selection { background: var(--pink); color: #fff; }
:focus-visible { outline: 3px solid var(--pink-deep); outline-offset: 3px; }
.wrap { width: var(--page); margin-inline: auto; }
.skip { position: fixed; top: 8px; left: 8px; z-index: 1000; padding: 10px 16px; background: var(--ink); color: #fff; transform: translateY(-150%); }
.skip:focus { transform: translateY(0); }

.site-header {
  position: fixed;
  inset: 0 0 auto;
  z-index: 100;
  height: var(--header-h);
  border-bottom: 1px solid rgba(255, 255, 255, .1);
  background: rgba(34, 31, 40, .9);
  box-shadow: 0 8px 28px rgba(20, 17, 24, .12);
  backdrop-filter: blur(18px);
}
.header-inner { height: 100%; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 28px; }
.brand { display: inline-flex; align-items: center; gap: 11px; min-width: max-content; }
.brand-mark { width: 42px; height: 42px; display: grid; place-items: center; border-radius: 6px; background: #c92f58; color: #fff; font-size: 14px; font-weight: 900; box-shadow: 0 6px 18px rgba(201, 47, 88, .28); }
.brand-copy { display: grid; line-height: 1.08; }
.brand-copy b { color: #fff; font-size: 16px; }
.brand-copy small { margin-top: 5px; color: #ff9aaa; font-size: 9px; font-weight: 800; letter-spacing: .12em; }
.nav { display: flex; justify-content: flex-end; align-items: center; gap: 4px; }
.nav a { padding: 9px 12px; border-radius: 6px; color: rgba(255, 255, 255, .76); font-size: 14px; font-weight: 700; white-space: nowrap; }
.nav a:hover, .nav a[aria-current="page"] { background: rgba(255, 255, 255, .08); color: #ff8fa2; }
.header-call { min-height: 44px; display: inline-flex; align-items: center; justify-content: center; padding: 0 19px; border-radius: 999px; background: var(--pink); color: #fff; font-size: 14px; font-weight: 850; box-shadow: 0 6px 18px rgba(255, 107, 132, .32); white-space: nowrap; }
.header-call::before { content: "☎"; margin-right: 7px; }
.menu-toggle { display: none; width: 46px; height: 46px; padding: 11px; border: 1px solid rgba(255, 255, 255, .16); border-radius: 8px; background: rgba(255, 255, 255, .08); }
.menu-toggle span { display: block; height: 2px; margin: 5px 0; border-radius: 2px; background: #fff; }

/* Homepage header follows the reference: transparent over the photo, white after scroll. */
.home-page .site-header { border-bottom-color: transparent; background: transparent; box-shadow: none; backdrop-filter: none; transition: background .3s, border-color .3s, box-shadow .3s, backdrop-filter .3s; }
.home-page .site-header.is-scrolled { border-bottom-color: rgba(38, 36, 43, .08); background: rgba(255, 255, 255, .94); box-shadow: 0 1px 0 rgba(38, 36, 43, .08); backdrop-filter: blur(12px); }
.home-page .site-header.is-scrolled .brand-copy b { color: var(--ink); }
.home-page .site-header.is-scrolled .brand-copy small { color: var(--pink-deep); }
.home-page .site-header.is-scrolled .nav a { color: var(--text); }
.home-page .site-header.is-scrolled .nav a:hover,
.home-page .site-header.is-scrolled .nav a[aria-current="page"] { background: var(--pink-soft); color: var(--pink-deep); }
.home-page .site-header.is-scrolled .menu-toggle { border-color: rgba(38, 36, 43, .12); background: #fff; }
.home-page .site-header.is-scrolled .menu-toggle span { background: var(--ink); }

.hero { position: relative; min-height: 100dvh; display: grid; align-items: center; overflow: hidden; isolation: isolate; background: var(--footer); }
.hero-grid { min-height: 100dvh; display: flex; align-items: center; padding: 126px 0 126px; }
.hero-copy { position: relative; z-index: 3; width: min(760px, 66%); }
.hero-label, .area-label, .post-category { color: var(--pink-deep); font-size: 12px; font-weight: 850; letter-spacing: .13em; }
.hero-label { margin-bottom: 20px; color: #ff9aaa; }
.hero h1 { max-width: 820px; margin-bottom: 22px; color: #fff; font-size: clamp(50px, 7vw, 94px); line-height: 1.03; letter-spacing: -.065em; }
.hero h1 span { color: var(--pink); }
.hero-summary { max-width: 610px; margin-bottom: 30px; color: rgba(255, 255, 255, .84); font-size: 19px; font-weight: 600; }
.hero-actions, .btn-row { display: flex; flex-wrap: wrap; gap: 12px; }
.hero-media { position: absolute; inset: 0; z-index: 0; }
.hero-media picture { position: absolute; inset: 0; }
.hero-media img { width: 100%; height: 100%; object-fit: cover; object-position: center; }
.hero-media::after { content: ""; position: absolute; inset: 0; z-index: 1; background: radial-gradient(110% 80% at 82% 12%, rgba(255, 107, 132, .3), transparent 56%), linear-gradient(105deg, rgba(20, 15, 24, .78) 0%, rgba(20, 15, 24, .52) 38%, rgba(20, 15, 24, .18) 72%, rgba(20, 15, 24, 0) 100%), linear-gradient(180deg, rgba(20, 15, 24, .3) 0%, transparent 40%, rgba(20, 15, 24, .62) 100%); }
.hero-facts { position: absolute; z-index: 2; right: max(24px, calc((100vw - 1180px) / 2)); bottom: 34px; width: min(410px, calc(100% - 48px)); display: grid; grid-template-columns: 1fr 1fr; overflow: hidden; border: 1px solid rgba(255, 255, 255, .18); border-radius: 14px; background: rgba(34, 31, 40, .78); box-shadow: 0 18px 44px rgba(12, 10, 15, .28); backdrop-filter: blur(14px); }
.hero-facts div { padding: 17px 20px; }
.hero-facts div + div { border-left: 1px solid rgba(255, 255, 255, .14); }
.hero-facts b { display: block; color: #ff91a3; font-size: 19px; }
.hero-facts span { color: rgba(255, 255, 255, .68); font-size: 13px; }

.btn { min-height: 52px; display: inline-flex; align-items: center; justify-content: center; padding: 0 25px; border: 1px solid var(--pink); border-radius: 999px; font-weight: 850; white-space: nowrap; transition: transform .2s, box-shadow .2s, background .2s; }
.btn:hover { transform: translateY(-2px); }
.btn:active { transform: translateY(1px) scale(.985); }
.btn-fill { background: #c92f58; color: #fff; box-shadow: 0 10px 28px rgba(201, 47, 88, .28); }
.btn-fill:hover { background: #a92147; }
.btn-outline { background: #fff; color: var(--pink-deep); }
.hero .btn-outline { background: rgba(34, 31, 40, .22); border-color: rgba(255, 255, 255, .68); color: #fff; backdrop-filter: blur(8px); }
.text-link { color: var(--pink-deep); font-weight: 800; text-decoration: underline; text-decoration-color: #ffb89f; text-underline-offset: 5px; }

.trust-strip { position: relative; z-index: 4; margin-top: 0; background: var(--pink-soft); border-bottom: 1px solid var(--rose-line); }
.trust-grid { display: grid; grid-template-columns: repeat(4, 1fr); overflow: hidden; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
.trust-grid div { padding: 22px 24px; }
.trust-grid div + div { border-left: 1px solid var(--rose-line); }
.trust-grid strong { display: block; margin-bottom: 3px; color: var(--ink); }
.trust-grid span { color: #66616a; font-size: 13px; }

.section { position: relative; padding: clamp(84px, 10vw, 138px) 0; }
.section-soft { background: var(--pink-soft); }
.section-brand { background: var(--pink-pale); }
.section-faq { background: var(--pink-pale); }
.section-head { max-width: 760px; margin-bottom: 46px; }
.section-head h2 { margin-bottom: 14px; }
.section-head p { margin-bottom: 0; font-size: 18px; }
.section-more { margin: 28px 0 0; }
.kicker { margin-bottom: 12px; color: var(--pink-deep); font-size: 12px; font-weight: 850; letter-spacing: .1em; }

.promise-grid { display: grid; grid-template-columns: 1.25fr .75fr; gap: 22px; align-items: stretch; }
.promise-main { min-height: 420px; display: grid; align-content: end; padding: 44px; border: 1px solid rgba(38, 36, 43, .08); border-radius: var(--radius); background: linear-gradient(145deg, #ffe4e9, var(--pink-soft)); box-shadow: none; }
.promise-main h2, .promise-main h3 { color: var(--ink); }
.promise-main p { color: var(--text); }
.promise-main p { max-width: 600px; margin-bottom: 0; }
.promise-stack { display: grid; gap: 22px; }
.plain-card { padding: 32px; border: 1px solid var(--rose-line); border-radius: var(--radius); background: #fff; box-shadow: none; }
.plain-card strong { display: block; margin-bottom: 9px; font-size: 20px; }
.plain-card p { margin-bottom: 0; }

.location-layout, .media-split { display: grid; grid-template-columns: .92fr 1.08fr; gap: clamp(36px, 6vw, 86px); align-items: center; }
.location-list { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.location-item { min-height: 118px; padding: 22px; border: 1px solid var(--rose-line); border-radius: 12px; background: rgba(255, 255, 255, .94); box-shadow: none; }
.location-item b { display: block; margin-bottom: 5px; }
.location-item span { color: var(--muted); font-size: 14px; }
.address-large { color: var(--pink-deep); font-size: clamp(24px, 3vw, 38px); font-weight: 850; }
.media-split picture img { aspect-ratio: 4 / 3; object-fit: cover; border-radius: var(--radius); box-shadow: var(--shadow); }
.check-list { display: grid; gap: 11px; padding: 0; list-style: none; }
.check-list li { position: relative; padding-left: 28px; }
.check-list li::before { content: "✓"; position: absolute; left: 0; color: var(--pink-deep); font-weight: 900; }

.feature-grid { display: grid; grid-template-columns: 1.2fr .8fr; grid-template-rows: 1fr 1fr; gap: 20px; }
.feature-grid article { padding: 32px; border: 1px solid var(--rose-line); border-radius: var(--radius); background: #fff; }
.feature-grid article:first-child { grid-row: 1 / 3; min-height: 460px; display: grid; align-content: end; background: linear-gradient(150deg, #ffe4e9, var(--pink-soft)); }
.feature-grid article:first-child h3 { color: var(--ink); }
.feature-grid article:first-child p { color: var(--text); }
.feature-grid p { margin-bottom: 0; }

.price-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; }
.price-card { padding: clamp(34px, 5vw, 58px); border: 1px solid var(--rose-line); border-radius: var(--radius); background: #fff; box-shadow: none; }
.price-card.featured { background: linear-gradient(145deg, var(--pink-hover), var(--pink)); border-color: transparent; }
.price-card.featured span, .price-card.featured p, .price-card.featured li, .price-card.featured .price { color: #fff; }
.price-card .price { display: block; margin: 17px 0 24px; color: var(--pink-deep); font-size: clamp(42px, 6vw, 68px); line-height: 1; letter-spacing: -.06em; }
.price-card .price small { font-size: 15px; letter-spacing: -.02em; }
.price-card ul { margin: 0; padding-left: 20px; }
.notice-box { margin-top: 24px; padding: 22px 25px; border-left: 4px solid var(--pink); border-radius: 0 12px 12px 0; background: var(--pink-soft); }
.notice-box p { margin: 0; }
.info-columns { display: grid; grid-template-columns: 1.2fr .8fr; gap: 22px; }
.info-columns article { min-height: 280px; padding: 36px; border-radius: var(--radius); background: linear-gradient(145deg, #fff, var(--pink-soft)); border: 1px solid var(--rose-line); }
.info-columns article:last-child { margin-top: 56px; }
.room-specs { display: grid; grid-template-columns: 1.15fr .85fr; gap: 20px; }
.room-specs article { padding: 34px; border: 1px solid var(--rose-line); border-radius: var(--radius); background: #fff; }
.room-specs article:first-child { grid-row: 1 / 3; min-height: 410px; display: grid; align-content: end; background: linear-gradient(145deg, #ffe8ed, #fff); }

.process-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; counter-reset: process; }
.process-grid article { counter-increment: process; min-height: 250px; padding: 30px; border: 1px solid var(--rose-line); border-radius: var(--radius); background: linear-gradient(150deg, #fff, var(--pink-soft)); }
.process-grid article::before { content: counter(process); width: 38px; height: 38px; display: grid; place-items: center; margin-bottom: 42px; border-radius: 6px; background: var(--pink); color: #fff; font-size: 13px; font-weight: 900; }

.pickup-regions { display: grid; grid-template-columns: 1.1fr .9fr; gap: 18px; }
.pickup-regions article { padding: 30px; border: 1px solid var(--rose-line); border-radius: var(--radius); background: #fff; }
.pickup-regions article:first-child { grid-row: 1 / 3; min-height: 380px; display: grid; align-content: end; background: linear-gradient(145deg, #ffe7ec, #fff); }
.route-panel { display: grid; grid-template-columns: 1.2fr .8fr; gap: 60px; align-items: start; }

.area-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.area-card { min-height: 260px; padding: 30px; display: flex; flex-direction: column; border: 1px solid var(--rose-line); border-radius: var(--radius); background: #fff; box-shadow: none; transition: transform .22s, box-shadow .22s, border-color .22s; }
.area-card:nth-child(3n + 1) { min-height: 260px; background: linear-gradient(145deg, #fff, #fff0f3); }
.area-card:hover, .post-card:hover { transform: translateY(-4px); box-shadow: var(--shadow); }
.area-card p { flex: 1; }
.area-card span { color: var(--pink-deep); font-weight: 800; }

.area-intro { background: linear-gradient(145deg, #fff, var(--pink-soft)); }
.area-intro-grid { display: grid; grid-template-columns: 1.15fr .85fr; gap: 70px; align-items: start; }
.area-label { display: inline-block; margin-bottom: 16px; }
.area-landmarks { padding: 32px; border: 1px solid var(--rose-line); border-radius: var(--radius); background: #fff; box-shadow: none; }
.area-landmarks h2 { font-size: 26px; }
.area-landmarks ul { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; padding: 0; list-style: none; }
.area-landmarks li { padding: 14px; border-radius: 10px; background: var(--pink-pale); }
.area-landmarks b, .area-landmarks span { display: block; }
.area-landmarks span { color: var(--muted); font-size: 12px; }
.area-story { display: grid; grid-template-columns: 1.2fr .8fr; gap: 20px; }
.area-story article { padding: 32px; border: 1px solid var(--rose-line); border-radius: var(--radius); background: rgba(255, 255, 255, .92); }
.area-story article:first-child { grid-row: 1 / 3; min-height: 420px; display: grid; align-content: end; }
.area-route-head { max-width: 820px; margin-bottom: 40px; }
.route-flow { display: grid; grid-template-columns: repeat(4, 1fr); overflow: hidden; border: 1px solid var(--rose-line); border-radius: var(--radius); background: #fff; }
.route-flow div { min-height: 130px; padding: 25px; }
.route-flow div + div { border-left: 1px solid var(--rose-line); }
.route-flow b, .route-flow span { display: block; }
.route-flow span { color: var(--muted); font-size: 13px; }
.area-yeonsu-dong .area-intro-grid { grid-template-columns: .82fr 1.18fr; }
.area-yeonsu-dong .area-landmarks { order: -1; }
.area-namdong-gu .area-story { grid-template-columns: .8fr 1.2fr; }
.area-namdong-gu .area-story article:first-child { grid-column: 2; }
.area-michuhol-gu .area-story { grid-template-columns: repeat(3, 1fr); }
.area-michuhol-gu .area-story article:first-child { grid-row: auto; min-height: 330px; }
.area-bupyeong-gu .area-intro { background: linear-gradient(120deg, #ffe9ee, #fff); }
.area-bupyeong-gu .area-story article:nth-child(2) { transform: translateY(34px); }
.area-seo-gu .area-landmarks ul { grid-template-columns: 1fr; }
.area-seo-gu .area-intro-grid { grid-template-columns: 1.35fr .65fr; }

.page-hero { padding: calc(var(--header-h) + 72px) 0 68px; background: radial-gradient(80% 160% at 85% 0%, rgba(255, 255, 255, .22), transparent 58%), linear-gradient(120deg, var(--pink-deep), var(--pink)); border-bottom: 1px solid rgba(255, 255, 255, .22); }
.breadcrumb { margin-bottom: 22px; color: rgba(255, 255, 255, .6); font-size: 13px; }
.breadcrumb a { color: #ff9aaa; }
.page-hero h1 { max-width: 920px; margin-bottom: 18px; color: #fff; font-size: clamp(34px, 5vw, 62px); }
.page-hero p { max-width: 780px; margin-bottom: 0; color: rgba(255, 255, 255, .76); font-size: 18px; }

.blog-feature { background: linear-gradient(180deg, #fff, var(--pink-pale)); }
.blog-intro { max-width: 800px; margin-bottom: 48px; }
.post-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; align-items: stretch; }
.post-card { overflow: hidden; border: 1px solid var(--rose-line); border-radius: var(--radius); background: #fff; box-shadow: none; transition: transform .22s, box-shadow .22s; }
.post-card img { aspect-ratio: 16 / 9; object-fit: cover; }
.post-card-body { padding: 25px 27px 28px; }
.post-category { display: block; margin-bottom: 9px; }
.post-card-body h2, .post-card-body h3 { margin-bottom: 10px; font-size: 24px; }
.post-card-body p { margin-bottom: 0; font-size: 15px; }
.area-directory { display: grid; gap: 28px; }
.area-chapter { scroll-margin-top: 100px; padding: 42px; border: 1px solid var(--rose-line); border-radius: var(--radius); background: #fff; }
.area-chapter-head { max-width: 820px; margin-bottom: 28px; }
.area-chapter-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.area-chapter-grid article { padding: 24px; border-radius: 12px; background: var(--pink-soft); }
.area-chapter-grid h3 { margin-bottom: 10px; font-size: 19px; }

.article-wrap { background: linear-gradient(180deg, #fff, var(--pink-pale)); }
.prose { width: min(840px, calc(100vw - 48px)); margin: 0 auto; }
.prose p, .prose li { font-size: 18px; }
.summary-box { margin-bottom: 30px; padding: 28px 30px; border-radius: var(--radius); background: var(--pink-soft); }
.summary-box strong { display: block; margin-bottom: 8px; color: var(--pink-deep); }
.summary-box p { margin-bottom: 0; }
.article-cover { margin: 0 0 40px; }
.article-cover img { aspect-ratio: 16 / 9; object-fit: cover; border-radius: var(--radius); box-shadow: var(--shadow); }
.article-checklist { margin: 0 0 70px; padding: 34px; border: 1px solid var(--rose-line); border-radius: var(--radius); background: #fff; }
.article-checklist h2 { margin-bottom: 24px; font-size: 28px; }
.article-checklist ol { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; margin: 0; padding: 0; list-style: none; counter-reset: check; }
.article-checklist li { counter-increment: check; padding: 20px; border-radius: 10px; background: var(--pink-pale); }
.article-checklist li::before { content: counter(check); width: 30px; height: 30px; display: grid; place-items: center; margin-bottom: 18px; border-radius: 5px; background: var(--pink); color: #fff; font-size: 12px; font-weight: 900; }
.article-checklist strong, .article-checklist span { display: block; }
.article-checklist span { margin-top: 7px; color: var(--muted); font-size: 14px; }
.article-section { margin: 0 0 62px; }
.article-section h2 { margin-bottom: 18px; font-size: 34px; }
.article-section p { margin-bottom: 0; }
.source-box { margin: 70px 0; padding: 32px; border: 1px solid var(--rose-line); border-radius: var(--radius); background: #fff; }
.source-box h2 { font-size: 26px; }
.source-links { display: flex; flex-wrap: wrap; gap: 10px; }
.source-links a { padding: 10px 15px; border-radius: 999px; background: var(--pink-soft); color: var(--pink-deep); font-weight: 750; }
.article-faq { margin-top: 72px; }
.article-faq > h2 { margin-bottom: 28px; }
.related { margin-top: 72px; padding: 34px; border-radius: var(--radius); background: linear-gradient(145deg, #ffe8ed, #fff); }
.related h2 { font-size: 28px; }
.related p { margin-bottom: 0; }
.prose a:not(.btn) { color: var(--pink-deep); text-decoration: underline; text-underline-offset: 4px; }

.faq-wrap { max-width: 960px; }
.faq-list { display: grid; gap: 14px; }
.faq-item { overflow: hidden; border: 1px solid var(--rose-line); border-radius: 12px; background: #fff; box-shadow: none; }
.faq-item summary { position: relative; padding: 22px 58px 22px 26px; cursor: pointer; color: var(--ink); font-weight: 800; list-style: none; }
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary::after { content: "+"; position: absolute; top: 18px; right: 24px; color: var(--pink); font-size: 27px; font-weight: 500; }
.faq-item[open] summary::after { content: "-"; }
.faq-answer { padding: 0 26px 24px; }
.faq-answer p { margin: 0; }

.contact-grid { display: grid; grid-template-columns: 1.05fr .95fr; gap: 22px; }
.contact-card { min-height: 300px; display: flex; flex-direction: column; justify-content: space-between; padding: 38px; border: 1px solid var(--rose-line); border-radius: var(--radius); background: #fff; box-shadow: none; }
.contact-card:first-child { background: linear-gradient(145deg, var(--pink-hover), var(--pink)); border-color: transparent; }
.contact-card:first-child h2, .contact-card:first-child p { color: #fff; }

.cta-band { position: relative; overflow: hidden; padding: 96px 0; text-align: center; background: #a92147; }
.cta-band::before { content: ""; position: absolute; width: 280px; height: 280px; left: -70px; top: -110px; border: 1px solid rgba(255, 255, 255, .3); border-radius: 50%; }
.cta-band .wrap { position: relative; z-index: 1; }
.cta-band h2 { margin-bottom: 12px; color: #fff; }
.cta-band p { color: rgba(255, 255, 255, .9); }
.cta-band .btn-row { justify-content: center; margin-top: 28px; }
.cta-band .btn-fill { background: #fff; color: var(--pink-deep); }
.cta-band .btn-outline { border-color: rgba(255, 255, 255, .7); background: rgba(255, 255, 255, .14); color: #fff; }

.site-footer { padding: 64px 0 36px; background: var(--footer); color: #f2eef1; }
.footer-grid { display: grid; grid-template-columns: 1.25fr .65fr .65fr; gap: 48px; }
.footer-brand { display: flex; align-items: center; gap: 11px; margin-bottom: 18px; color: #fff; font-weight: 850; }
.site-footer p { max-width: 430px; color: #bdb7c1; font-size: 14px; }
.site-footer strong { color: #fff; }
.footer-nav { display: grid; align-content: start; gap: 9px; }
.footer-nav b { margin-bottom: 7px; color: #fff; }
.footer-nav a { color: #bdb7c1; font-size: 14px; }
.footer-note { grid-column: 1 / -1; padding-top: 26px; border-top: 1px solid rgba(255, 255, 255, .1); }
.footer-note p { max-width: none; margin-bottom: 7px; font-size: 12px; }
.mobile-cta { display: none; }

@media (max-width: 1040px) {
  body.menu-open { overflow: hidden; }
  .nav { position: absolute; top: 100%; right: 0; left: 0; height: calc(100dvh - var(--header-h)); display: none; grid-auto-rows: min-content; align-content: start; align-items: stretch; justify-content: stretch; gap: 0; overflow-y: auto; padding: 20px 24px 96px; border-top: 1px solid rgba(255, 255, 255, .1); background: rgba(34, 31, 40, .98); box-shadow: 0 20px 40px rgba(20, 17, 24, .24); }
  .nav.open { display: grid; }
  .nav a { padding: 14px 8px; border-bottom: 1px solid rgba(255, 255, 255, .1); border-radius: 0; color: rgba(255, 255, 255, .86); font-size: 17px; }
  .nav a:hover, .nav a[aria-current="page"] { padding-left: 16px; }
  .header-call { display: none; }
  .menu-toggle { display: block; justify-self: end; }
  .menu-toggle span { transition: transform .2s ease, opacity .2s ease; }
  .menu-toggle[aria-expanded="true"] span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
  .menu-toggle[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
  .menu-toggle[aria-expanded="true"] span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
  .header-inner { grid-template-columns: auto 1fr; }
  .home-page .site-header.is-scrolled .nav { background: rgba(255, 255, 255, .98); box-shadow: 0 20px 40px rgba(38, 36, 43, .12); }
  .home-page .site-header.is-scrolled .nav a { border-bottom-color: rgba(38, 36, 43, .1); color: var(--ink); }
  .hero-copy { width: min(650px, 70%); }
  .area-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .process-grid, .route-flow { grid-template-columns: 1fr 1fr; }
  .route-flow div:nth-child(3) { border-left: 0; border-top: 1px solid var(--rose-line); }
  .route-flow div:nth-child(4) { border-top: 1px solid var(--rose-line); }
}

@media (max-width: 767px) {
  :root { --page: min(100% - 32px, 680px); --header-h: 68px; --mobile-cta-h: calc(66px + env(safe-area-inset-bottom)); }
  body { padding-bottom: var(--mobile-cta-h); font-size: 15px; }
  h1 { font-size: 38px; }
  h2 { font-size: 29px; }
  .brand-copy small { display: none; }
  .brand-copy b { font-size: 14px; }
  .hero, .hero-grid { min-height: clamp(568px, 100dvh, 760px); }
  .hero-grid { align-items: flex-start; padding: 110px 0 170px; }
  .hero-copy { width: 100%; }
  .hero-label { margin-bottom: 10px; font-size: 10px; }
  .hero h1 { margin-bottom: 14px; }
  .hero-summary { max-width: 320px; margin-bottom: 20px; font-size: 15px; }
  .hero-actions .btn { width: 100%; }
  .hero-actions .btn-outline { display: none; }
  .hero-media img { object-position: 62% center; }
  .hero-media::after { background: radial-gradient(110% 70% at 78% 12%, rgba(255, 107, 132, .28), transparent 54%), linear-gradient(180deg, rgba(20, 15, 24, .72) 0%, rgba(20, 15, 24, .5) 48%, rgba(20, 15, 24, .68) 72%, rgba(20, 15, 24, .9) 100%); }
  .hero-facts { right: 16px; left: 16px; bottom: calc(var(--mobile-cta-h) + 16px); width: auto; }
  .hero-facts div { padding: 14px; }
  .hero-facts b { font-size: 16px; }
  .trust-strip { margin-top: 0; }
  .trust-grid { grid-template-columns: 1fr 1fr; border-radius: 0; border-inline: 0; }
  .trust-grid div { padding: 16px; }
  .trust-grid div:nth-child(3) { border-left: 0; border-top: 1px solid var(--rose-line); }
  .trust-grid div:nth-child(4) { border-top: 1px solid var(--rose-line); }
  .section { padding: 74px 0; }
  .section-head { margin-bottom: 30px; }
  .section-head p, .page-hero p { font-size: 15px; }
  .promise-grid, .location-layout, .media-split, .feature-grid, .price-grid, .info-columns, .room-specs, .pickup-regions, .route-panel, .area-grid, .area-intro-grid, .area-story, .post-grid, .area-chapter-grid, .contact-grid, .footer-grid { grid-template-columns: 1fr; }
  .promise-main { min-height: 310px; padding: 30px; }
  .plain-card, .price-card, .info-columns article, .room-specs article, .pickup-regions article, .area-story article, .contact-card { padding: 26px; }
  .feature-grid article:first-child, .room-specs article:first-child, .pickup-regions article:first-child, .area-story article:first-child { grid-row: auto; min-height: 300px; }
  .info-columns article:last-child, .area-bupyeong-gu .area-story article:nth-child(2) { margin-top: 0; transform: none; }
  .location-list { grid-template-columns: 1fr; }
  .media-split picture { order: -1; }
  .process-grid { grid-template-columns: 1fr; }
  .process-grid article { min-height: 210px; }
  .area-card, .area-card:nth-child(3n + 1) { min-height: 240px; }
  .area-landmarks { padding: 24px; }
  .area-landmarks ul, .area-seo-gu .area-landmarks ul { grid-template-columns: 1fr 1fr; }
  .area-yeonsu-dong .area-landmarks { order: initial; }
  .area-namdong-gu .area-story article:first-child { grid-column: auto; }
  .area-michuhol-gu .area-story { grid-template-columns: 1fr; }
  .route-flow { grid-template-columns: 1fr 1fr; }
  .post-card, .post-card:nth-child(4n + 1) { grid-row: auto; }
  .post-card img, .post-card:nth-child(4n + 1) img { aspect-ratio: 16 / 9; }
  .area-chapter { padding: 28px 22px; }
  .prose { width: var(--page); }
  .article-checklist { padding: 24px; }
  .article-checklist ol { grid-template-columns: 1fr; }
  .article-section { margin-bottom: 50px; }
  .article-section h2 { font-size: 28px; }
  .page-hero { padding: calc(var(--header-h) + 48px) 0 44px; }
  .faq-item summary { padding: 19px 50px 19px 20px; }
  .faq-answer { padding: 0 20px 20px; }
  .cta-band { padding: 76px 0; }
  .footer-note { grid-column: auto; }
  .mobile-cta { position: fixed; inset: auto 0 0; z-index: 120; height: var(--mobile-cta-h); display: grid; grid-template-columns: 1fr 1fr; padding-bottom: env(safe-area-inset-bottom); }
  .mobile-cta a { display: grid; place-items: center; color: #fff; font-weight: 850; }
  .mobile-cta a:first-child { background: #a92147; }
  .mobile-cta a:last-child { background: var(--footer); }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition-duration: .01ms !important; }
}
