:root {
  --white: #FFFFFF;
  --bg-soft: #F7F6F3;
  --bg-tint: #F0EEE8;
  --ink: #23262B;
  --ink-soft: #4B5057;
  --ink-mute: #666B73;
  --line: #E4E1DA;
  --line-strong: #8B8F96;
  --gold: #B08D4F;
  --gold-soft: #D2B57B;
  --gold-text: #806127;
  --gold-bright: #FFE9A8;
  --gold-ink: #3E2A05;
  --gold-metal: linear-gradient(100deg, #FFF3C4, #D9A93A 35%, #FFE89A 55%, #B8862A 80%, #FFF3C4);
  --gold-ring: conic-gradient(from 210deg, #FFF3C4, #D9A93A, #FFE89A, #B8862A, #FFF3C4, #C9982F, #FFF3C4);
  --gold-glow: 0 0 16px rgba(255, 233, 168, .55);
  --danger: #B3261E;
  --ok: #2F6B4F;

  --glass: rgba(255, 255, 255, .82);
  --glass-line: rgba(255, 255, 255, .7);
  --shadow-sm: 0 1px 2px rgba(35, 38, 43, .06);
  --shadow-md: 0 12px 32px -12px rgba(35, 38, 43, .18);
  --shadow-lg: 0 28px 64px -24px rgba(35, 38, 43, .28);
  --radius-sm: 10px;
  --radius: 16px;
  --radius-lg: 24px;

  --space-1: 4px; --space-2: 8px; --space-3: 12px; --space-4: 16px; --space-5: 24px;
  --space-6: 32px; --space-7: 48px; --space-8: 64px; --space-9: 96px; --space-10: 128px;

  --ease: cubic-bezier(.2, .7, .2, 1);
  --fast: 180ms;
  --slow: 640ms;
  --bar-h: 64px;
  --wrap: 960px;
}

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: 88px; }
body {
  margin: 0;
  background: var(--white);
  color: var(--ink);
  font-family: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont, "Apple SD Gothic Neo", "Malgun Gothic", sans-serif;
  font-size: 17px;
  line-height: 1.7;
  word-break: keep-all;
  overflow-wrap: anywhere;
  padding-bottom: calc(var(--bar-h) + env(safe-area-inset-bottom));
}
img { display: block; max-width: 100%; height: auto; }
a { color: inherit; }
h1, h2, h3, h4, p, ul, ol, dl, dd, figure { margin: 0; }
ul, ol { padding: 0; list-style: none; }
h1, h2, h3 { line-height: 1.22; letter-spacing: -.025em; font-weight: 700; text-wrap: balance; }
h1 { font-size: clamp(2.5rem, 7.4vw, 4.75rem); letter-spacing: -.04em; line-height: 1.12; }
h2 { font-size: clamp(1.875rem, 4.2vw, 2.875rem); }
h3 { font-size: 1.25rem; }
button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; }
:focus-visible { outline: 2px solid var(--ink); outline-offset: 3px; border-radius: 4px; }
[hidden] { display: none !important; }

.sprite { position: absolute; }
.icon { width: 1.25em; height: 1.25em; flex: none; }
.wrap { width: min(100% - 40px, var(--wrap)); margin-inline: auto; }
.narrow { width: min(100% - 40px, 780px); margin-inline: auto; }
.skip { position: absolute; left: 12px; top: -60px; z-index: 100; padding: 10px 16px; background: var(--ink); color: var(--white); border-radius: var(--radius-sm); }
.skip:focus { top: 12px; }
.visually-hidden { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }

.notice { padding: 8px 20px; background: var(--ink); color: var(--white); font-size: .875rem; text-align: center; }

/* 헤더 */
.site-header {
  position: sticky; top: 0; z-index: 40;
  background: var(--glass);
  -webkit-backdrop-filter: blur(16px) saturate(1.4);
  backdrop-filter: blur(16px) saturate(1.4);
  border-bottom: 1px solid rgba(35, 38, 43, .07);
}
.header-row { display: flex; align-items: center; gap: var(--space-5); min-height: 72px; }
.logo { display: inline-flex; align-items: center; gap: 10px; font-weight: 700; font-size: 1.125rem; letter-spacing: -.02em; text-decoration: none; white-space: nowrap; }
.logo-mark { width: auto; height: 40px; filter: saturate(1.3) brightness(1.05); }
/* 로고 차량: 금빛이 지나가며 살짝 달린다 */
.logo-shine { position: relative; display: inline-block; line-height: 0; filter: drop-shadow(0 0 5px rgba(217, 169, 58, .6)); animation: logo-drive 3.2s ease-in-out infinite; }
.logo-shine::after { content: ""; position: absolute; inset: 0; background: linear-gradient(105deg, transparent 42%, var(--white) 50%, transparent 58%) 150% 0 / 300% 100% no-repeat; -webkit-mask: url("logo-mark.webp") center / 100% 100% no-repeat; mask: url("logo-mark.webp") center / 100% 100% no-repeat; animation: logo-sweep 3.2s linear infinite; }
@keyframes logo-drive { 0%, 100% { transform: translateX(-2px); } 50% { transform: translateX(3px); } }
@keyframes logo-sweep { 0%, 35% { background-position: 150% 0; } 100% { background-position: -50% 0; } }
.nav { display: flex; gap: var(--space-2); margin-left: var(--space-5); }
.nav a { padding: 8px 12px; white-space: nowrap; border-radius: var(--radius-sm); color: var(--ink-soft); font-size: 1rem; text-decoration: none; transition: color var(--fast), background var(--fast); }
.nav a:hover { color: var(--ink); background: var(--bg-soft); }
.nav a[aria-current] { color: var(--ink); font-weight: 600; box-shadow: inset 0 -2px 0 var(--gold); border-radius: 0; }
.header-actions { display: flex; align-items: center; gap: var(--space-3); margin-left: auto; }
.header-tel { position: relative; display: inline-flex; align-items: center; gap: 6px; padding: 7px 14px; white-space: nowrap; overflow: hidden; border-radius: 999px; background: var(--gold-metal); box-shadow: 0 0 0 2px var(--gold-text), inset 0 0 0 2px rgba(255, 255, 255, .55), var(--gold-glow); color: var(--gold-ink); font-weight: 700; text-decoration: none; font-variant-numeric: tabular-nums; }
.header-cta { position: relative; overflow: hidden; box-shadow: 0 0 0 2px var(--gold), var(--gold-glow); color: var(--gold-bright); }
.menu-btn { display: none; width: 44px; height: 44px; align-items: center; justify-content: center; border: 0; background: transparent; }

/* 버튼 */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  min-height: 52px; padding: 12px 28px;
  border: 1px solid transparent; border-radius: 999px;
  font-weight: 600; text-decoration: none; white-space: nowrap; cursor: pointer;
  transition: background var(--fast), color var(--fast), border-color var(--fast), box-shadow var(--fast), transform var(--fast);
}
.btn:active { transform: scale(.98); }
.btn[disabled] { opacity: .5; cursor: not-allowed; }
.btn-sm { min-height: 44px; padding: 8px 20px; font-size: .9375rem; }
.btn-primary { background: var(--ink); color: var(--white); }
.btn-primary:hover { background: #111316; box-shadow: var(--shadow-md); }
.btn-outline { background: transparent; border-color: var(--line-strong); }
.btn-outline:hover { border-color: var(--ink); background: var(--bg-soft); }
.btn-block { width: 100%; }
.link-more { display: inline-flex; align-items: center; gap: 6px; font-weight: 600; text-decoration: none; }
.link-more .icon { transition: transform var(--fast) var(--ease); }
.link-more:hover .icon { transform: translateX(4px); }

/* 공통 섹션 */
.section { padding-block: var(--space-10); }
.section-soft { background: var(--bg-soft); }
.section-ink { background: var(--ink); color: var(--white); }
.eyebrow { color: var(--gold-text); font-weight: 600; font-size: .9375rem; letter-spacing: .02em; margin-bottom: var(--space-3); }
.section-ink .eyebrow { color: var(--gold-soft); }
.section-head { max-width: 680px; margin-bottom: var(--space-8); }
.section-head p:not(.eyebrow) { margin-top: var(--space-4); color: var(--ink-soft); font-size: 1.125rem; }
.section-ink .section-head p:not(.eyebrow) { color: #D5D6D8; }

/* 상단 띠: 실제 현장 사진이 흐르고, 양옆에 약속 문구와 금메달을 얹는다 */
.band { --edge: max(20px, calc((100% - var(--wrap)) / 2)); position: relative; height: 208px; overflow: hidden; background: var(--ink); }
.band::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; z-index: 1; height: 3px; background: var(--gold-metal); box-shadow: 0 0 12px rgba(255, 233, 168, .5); }
.band-track { display: flex; width: max-content; height: 100%; }
.band-track.is-moving { animation: band-slide 60s linear infinite; }
.band-track li { position: relative; flex: none; width: 278px; height: 100%; margin-right: 2px; }
.band-track img { width: 100%; height: 100%; object-fit: cover; }
.band-track span { position: absolute; left: var(--space-3); bottom: var(--space-3); padding: 2px 10px; border-radius: 999px; background: rgba(35, 38, 43, .78); color: var(--white); font-size: .8125rem; font-weight: 600; }
@keyframes band-slide { to { transform: translateX(-33.3333%); } }
.band-copy {
  position: absolute; inset: 0; display: flex; align-items: center; justify-content: space-between; gap: var(--space-5); padding-inline: var(--edge);
  background: linear-gradient(90deg, rgba(35, 38, 43, .6) 0, rgba(35, 38, 43, .97) var(--edge), rgba(35, 38, 43, .97) calc(var(--edge) + 330px), transparent calc(var(--edge) + 400px), transparent calc(100% - var(--edge) - 340px), rgba(35, 38, 43, .97) calc(100% - var(--edge) - 272px), rgba(35, 38, 43, .97) calc(100% - var(--edge)), rgba(35, 38, 43, .6) 100%);
  pointer-events: none;
}
.band-lead { color: #E7E7E8; font-size: .9375rem; font-weight: 500; }
.band-title { margin-top: var(--space-2); background: linear-gradient(100deg, var(--gold-soft) 20%, var(--gold-bright) 40%, var(--white) 50%, var(--gold-bright) 60%, var(--gold-soft) 80%) 0 0 / 220% 100%; -webkit-background-clip: text; background-clip: text; color: transparent; font-size: 2rem; font-weight: 800; letter-spacing: -.02em; line-height: 1.2; white-space: nowrap; animation: band-shine 5s linear infinite; }
@keyframes band-shine { to { background-position: -220% 0; } }
.band-title span { display: inline-block; }
.band-medals { display: flex; flex: none; gap: var(--space-3); padding-bottom: var(--space-3); perspective: 600px; }
.band-medals li { position: relative; }
.band-medals li::before { content: ""; position: absolute; top: 58px; left: 50%; width: 46px; height: 42px; transform: translateX(-50%); background: linear-gradient(90deg, var(--gold-text) 0 30%, var(--gold-soft) 30% 70%, var(--gold-text) 70%); clip-path: polygon(0 0, 100% 0, 100% 100%, 50% 76%, 0 100%); }
.medal { position: relative; display: grid; justify-items: center; align-content: center; width: 76px; height: 76px; overflow: hidden; border-radius: 50%; background: var(--gold-ring); box-shadow: 0 0 0 2px var(--gold-text), inset 0 0 0 4px rgba(255, 255, 255, .55), 0 0 22px rgba(255, 233, 168, .5); color: var(--gold-ink); line-height: 1.1; transition: transform 280ms var(--ease); }
.medal.is-turn { transform: rotateY(90deg); }
.medal::after, .header-tel::after, .header-cta::after, .dock a[href^="tel"]::after, .bottom-bar a[href^="tel"]::after, .bottom-bar a.is-primary::after { content: ""; position: absolute; inset: -20% auto -20% -60%; width: 40%; transform: skewX(-20deg); background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .6), transparent); animation: medal-sheen 4s var(--ease) infinite; pointer-events: none; }
.header-cta::after, .bottom-bar a.is-primary::after { background: linear-gradient(90deg, transparent, rgba(255, 233, 168, .35), transparent); animation-delay: .6s; }
.band-medals li:nth-child(2) .medal::after { animation-delay: .4s; }
.band-medals li:nth-child(3) .medal::after { animation-delay: .8s; }
@keyframes medal-sheen { 0%, 60% { left: -60%; } 100% { left: 130%; } }
.medal small { font-size: .625rem; }
.medal b { font-size: 1.1875rem; font-weight: 800; letter-spacing: -.02em; }
@media (min-width: 1200px) { .band { --edge: max(108px, calc((100% - var(--wrap)) / 2)); } }
@media (max-width: 899px) {
  .band { height: auto; }
  .band-track { height: 92px; }
  .band-track li { width: 124px; }
  .band-track span { left: var(--space-1); bottom: var(--space-1); padding-inline: 8px; font-size: .75rem; }
  .band-copy { position: static; gap: var(--space-3); padding-block: var(--space-2) var(--space-4); background: none; }
  .band-title { margin-top: var(--space-1); font-size: clamp(1.0625rem, 4.4vw, 1.75rem); }
  .band-medals { gap: var(--space-2); padding-bottom: 0; }
  .band-medals li::before { top: 36px; width: 30px; height: 26px; }
  .medal { width: 48px; height: 48px; }
  .medal small { display: none; }
  .medal b { font-size: .8125rem; }
}
@media (max-width: 520px) { .band-lead { display: none; } .band-title { margin-top: 0; white-space: normal; } }

.page-head { padding-block: var(--space-9) var(--space-8); background: linear-gradient(180deg, var(--bg-soft), var(--white)); }
.page-head h1 { font-size: clamp(2.25rem, 5.6vw, 3.75rem); }
.page-head p:not(.eyebrow) { max-width: 640px; margin-top: var(--space-4); color: var(--ink-soft); font-size: 1.125rem; }

/* 히어로 */
.hero { position: relative; padding-block: var(--space-9) var(--space-10); overflow: hidden; background: linear-gradient(180deg, var(--bg-soft) 0%, var(--white) 72%); }
.hero-grid { display: grid; grid-template-columns: 1.05fr .95fr; gap: var(--space-8); align-items: center; }
.hero-services { margin-bottom: var(--space-3); color: var(--gold-text); font-size: clamp(1.25rem, 3.2vw, 1.75rem); font-weight: 700; letter-spacing: -.02em; line-height: 1.3; }
.hero-duties { margin-top: var(--space-5); color: var(--ink-soft); font-size: 1.0625rem; }
.hero-duties-title { margin-bottom: var(--space-2); color: var(--ink); font-weight: 700; }
.hero-duties li { display: flex; gap: var(--space-2); line-height: 1.5; padding-block: 3px; }
.hero-duties b { color: var(--ink); }
.hero-duties .icon { flex: none; width: 20px; height: 20px; margin-top: 2px; color: var(--gold-text); }
.hero-visual { position: relative; padding-bottom: var(--space-8); }
.hero-slider { position: relative; aspect-ratio: 5 / 4; overflow: hidden; background: var(--bg-tint); border-radius: var(--radius-lg); box-shadow: var(--shadow-lg); }
.hero-slider li { position: absolute; inset: 0; opacity: 0; transition: opacity 1200ms var(--ease); }
.hero-slider li.is-active { opacity: 1; }
.hero-photo { width: 100%; height: 100%; object-fit: cover; }
.hero-slider .is-active .hero-photo, .hero-slider .is-leaving .hero-photo { animation: hero-drift 8s linear forwards; }
.hero-slider li:nth-child(even).is-active .hero-photo, .hero-slider li:nth-child(even).is-leaving .hero-photo { animation-name: hero-drift-back; }
.hero-slider.is-paused .hero-photo { animation-play-state: paused; }
@keyframes hero-drift { from { transform: scale(1.02); } to { transform: scale(1.12) translateX(-2%); } }
@keyframes hero-drift-back { from { transform: scale(1.12) translateX(-2%); } to { transform: scale(1.02); } }
.hero-caption, .hero-temp { position: absolute; left: var(--space-4); padding: 4px 12px; border-radius: 999px; background: rgba(35, 38, 43, .78); color: var(--white); font-size: .875rem; }
.hero-caption { top: var(--space-4); font-weight: 600; }
.hero-temp { top: 56px; background: rgba(255, 255, 255, .86); color: var(--ink); font-size: .75rem; }
.hero-controls { position: absolute; top: var(--space-4); right: var(--space-4); display: flex; align-items: center; height: 32px; padding-inline: 6px; border-radius: 999px; background: rgba(35, 38, 43, .78); }
.hero-dots { display: flex; }
.hero-dots button, .hero-toggle { display: grid; place-items: center; width: 24px; height: 28px; padding: 0; border: 0; background: none; }
.hero-dots button::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: rgba(255, 255, 255, .5); }
.hero-dots button[aria-current]::before { background: var(--gold-soft); }
.hero-toggle span { width: 9px; height: 11px; border-inline: 3px solid var(--white); }
.is-paused .hero-toggle span { width: 0; height: 0; border-block: 6px solid transparent; border-inline: 10px solid transparent; border-left-color: var(--white); border-right-width: 0; }
.hero-controls :focus-visible, .strip-controls :focus-visible { outline-color: var(--white); outline-offset: -2px; }

/* 가로로 넘기는 띠 (간편접수, 이사 현장) */
.strip-bar { display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); margin-bottom: var(--space-4); }
.strip-temp { color: var(--ink-mute); font-size: .875rem; }
.strip-controls { display: flex; flex: none; align-items: center; height: 32px; padding-inline: 6px; border-radius: 999px; background: var(--ink); }
.strip-controls button { display: grid; place-items: center; width: 32px; height: 32px; padding: 0; border: 0; background: none; color: var(--white); }
.strip-controls .icon { width: 16px; height: 16px; }
.strip-prev .icon { transform: rotate(180deg); }
.strip-track { display: flex; gap: var(--space-4); overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; }
.strip-track::-webkit-scrollbar { display: none; }
.strip-track > li { flex: 0 0 max(270px, calc((100% - 32px) / 3)); scroll-snap-align: start; }

.chat { overflow: hidden; background: var(--white); border: 1px solid var(--line); border-radius: var(--radius); }
.chat-head { padding: var(--space-3) var(--space-4); background: var(--ink); color: var(--white); font-size: .875rem; font-weight: 600; }
.chat-body { display: flex; flex-direction: column; gap: var(--space-2); padding: var(--space-4); }
.bubble { align-self: flex-start; max-width: 88%; padding: var(--space-2) var(--space-3); border-radius: 14px; background: var(--bg-tint); font-size: .9375rem; line-height: 1.5; }
.bubble.me { align-self: flex-end; background: var(--gold-soft); }
.bubble .icon { width: 16px; height: 16px; margin-right: 6px; vertical-align: -3px; }

.photo-slot { display: grid; place-content: center; justify-items: center; gap: var(--space-1); aspect-ratio: 4 / 3; background: var(--bg-tint); border: 1px dashed var(--line-strong); border-radius: var(--radius); color: var(--ink-mute); font-size: .875rem; }
.section-soft .photo-slot { background: var(--white); }
.slot-name { margin-top: var(--space-2); font-weight: 600; }
.fleet { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--space-5) var(--space-4); }

/* 회사 소개의 허가·보험 서류 */
.certs { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--space-6) var(--space-5); text-align: center; }
.certs img { width: 100%; aspect-ratio: 1 / 1.414; object-fit: cover; object-position: top; border: 1px solid var(--line); box-shadow: var(--shadow-md); }
.certs h3 { margin-top: var(--space-4); }
.certs p { margin-top: var(--space-1); color: var(--ink-soft); font-size: .9375rem; }
.certs-note { margin-top: var(--space-6); color: var(--ink-mute); font-size: .875rem; }
.quote-card {
  position: absolute; left: calc(var(--space-7) * -1); right: var(--space-5); bottom: 0;
  padding: var(--space-5);
  background: var(--glass);
  -webkit-backdrop-filter: blur(20px) saturate(1.5);
  backdrop-filter: blur(20px) saturate(1.5);
  border: 1px solid var(--glass-line);
  border-radius: var(--radius);
  box-shadow: var(--shadow-lg);
}
.quote-title { font-weight: 700; font-size: 1.0625rem; margin-bottom: var(--space-3); }
.quote-grid { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-3); }
.quote-grid .span-2 { grid-column: span 2; }

/* 폼 */
.field label, .field .label { display: block; margin-bottom: 6px; font-weight: 600; font-size: .9375rem; }
.field .req { color: var(--danger); margin-left: 2px; }
.input, .select, .textarea {
  width: 100%; min-height: 50px; padding: 11px 14px;
  background: var(--white); border: 1px solid var(--line-strong); border-radius: var(--radius-sm);
  font-size: 1rem; transition: border-color var(--fast), box-shadow var(--fast);
}
.textarea { min-height: 110px; resize: vertical; }
.input:hover, .select:hover, .textarea:hover { border-color: var(--ink-soft); }
.input:focus, .select:focus, .textarea:focus { outline: none; border-color: var(--ink); box-shadow: 0 0 0 3px rgba(176, 141, 79, .35); }
.input[aria-invalid="true"], .select[aria-invalid="true"], .textarea[aria-invalid="true"] { border-color: var(--danger); }
.hint { margin-top: 6px; color: var(--ink-mute); font-size: .9375rem; }
.error { margin-top: 6px; color: var(--danger); font-size: .9375rem; font-weight: 500; }
.error:empty { display: none; }
.input-row { display: flex; gap: var(--space-2); }
.input-row .input { flex: 1; min-width: 0; }

.seg { display: grid; grid-auto-flow: column; grid-auto-columns: 1fr; padding: 4px; background: var(--bg-tint); border-radius: 12px; }
.seg label { margin: 0; }
.seg input { position: absolute; opacity: 0; }
.seg span { display: flex; align-items: center; justify-content: center; min-height: 42px; padding: 6px 8px; border-radius: 9px; font-size: .9375rem; font-weight: 600; color: var(--ink-soft); cursor: pointer; transition: background var(--fast), color var(--fast), box-shadow var(--fast); }
.seg input:checked + span { background: var(--white); color: var(--ink); box-shadow: var(--shadow-sm); }
.seg input:focus-visible + span { outline: 2px solid var(--ink); outline-offset: 1px; }

/* 카드 */
.grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-5); }
.grid-2 { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--space-5); }
.grid-4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--space-5); }
.card { padding: var(--space-6); background: var(--white); border: 1px solid var(--line); border-radius: var(--radius); }
.card-link { display: flex; flex-direction: column; gap: var(--space-3); min-height: 280px; text-decoration: none; transition: border-color var(--fast), box-shadow var(--fast), transform var(--fast) var(--ease); }
.card-link:hover { border-color: var(--gold); box-shadow: var(--shadow-md); transform: translateY(-3px); }
.card-link .link-more { margin-top: auto; }
.card p { color: var(--ink-soft); }
.h3-like { font-size: 1.25rem; margin-bottom: var(--space-2); }
.card-icon { display: grid; place-items: center; width: 52px; height: 52px; margin-bottom: var(--space-2); border-radius: 14px; background: var(--bg-soft); color: var(--gold-text); }
.card-icon .icon { width: 26px; height: 26px; }

/* 화물 페이지: 전국 지도와 차량 제원 */
#nationwide { background: radial-gradient(circle at 74% 50%, rgba(217, 169, 58, .16), transparent 42%), #14161A; }
#nationwide h1 { font-size: clamp(2.25rem, 5.6vw, 3.75rem); }
.map-copy { margin-top: var(--space-4); color: #D5D6D8; font-size: 1.0625rem; }
.map-list { margin-top: var(--space-4); } .check-list.map-list li { border-color: rgba(255, 255, 255, .22); }
.check-list.map-list li::before { border-color: var(--gold-bright); }
.korea-map { width: 100%; max-width: 440px; margin: 0 auto; }
.korea-map svg { display: block; width: 100%; height: auto; overflow: visible; }
/* 넓은 화면: 헤더·띠 아래 남는 높이에 지도 구역 전체가 들어오게 한다 (지도 비율 470:650) */
@media (min-width: 1081px) {
  #nationwide { padding-block: var(--space-5); }
  #nationwide h1 { font-size: 3rem; }
  #nationwide .split { gap: var(--space-6); }
  #nationwide .korea-map { max-width: min(440px, calc((100svh - 330px) * .723)); }
  .map-copy { margin-top: var(--space-3); font-size: 1rem; }
  .map-list { margin-top: var(--space-2); } .check-list.map-list li { padding-block: var(--space-2); }
  .check-list.map-list li::before { top: 16px; }
}
.korea-map text { fill: var(--white); font-size: 17px; font-weight: 700; paint-order: stroke; stroke: #14161A; stroke-width: 3px; }
.korea-map .nm-sub { fill: var(--gold-soft); font-size: 13px; font-weight: 500; }
.nm-land path, .nm-land circle { fill: url(#nm-dots); stroke: rgba(255, 233, 168, .6); stroke-width: 1.2; stroke-linejoin: round; }
.nm-routes path { fill: none; stroke: rgba(255, 233, 168, .45); stroke-width: 1.6; stroke-dasharray: 2 5; stroke-linecap: round; }
.nm-streaks path { fill: none; stroke: var(--gold-bright); stroke-width: 3.5; stroke-dasharray: 24 200; stroke-linecap: round; filter: drop-shadow(0 0 4px rgba(255, 233, 168, .8)); }
.nm-rings circle { fill: none; stroke: var(--gold-bright); stroke-width: 1.5; }
.nm-cities circle { fill: var(--white); stroke: rgba(217, 169, 58, .7); stroke-width: 3; }
.nm-cities .nm-small { fill: var(--gold-bright); stroke-width: 0; }
.nm-arrows path { fill: var(--white); }
.nm-cars circle { fill: #14161A; stroke: var(--gold-bright); stroke-width: 1.5; }
.nm-cars { color: var(--gold-bright); }
.nm-hub { color: var(--gold-ink); }
.nm-pulse { fill: none; stroke: var(--gold-bright); stroke-width: 1.5; }
.nm-core { fill: #D9A93A; stroke: var(--white); stroke-width: 2; }
.spec-tabs { display: flex; flex-wrap: wrap; gap: var(--space-2); margin-bottom: var(--space-4); }
.spec-tab { min-height: 44px; padding: 8px 20px; border: 1px solid var(--line-strong); border-radius: 999px; background: var(--white); color: var(--ink-soft); font-weight: 600; cursor: pointer; transition: background var(--fast), color var(--fast); }
.spec-tab[aria-pressed="true"] { border-color: var(--gold-text); background: var(--gold-metal); color: var(--gold-ink); font-weight: 700; }
.spec-panel { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: var(--space-3) var(--space-6); align-items: center; margin-bottom: var(--space-4); padding: var(--space-5); background: var(--white); border: 1px solid var(--line); border-radius: var(--radius); }
.js .spec-panel:not(.is-active) { display: none; }
.spec-panel h3 { grid-column: 1 / -1; font-size: 1.375rem; }
.spec-side { width: 100%; height: auto; color: var(--ink); }
.spec-box { fill: var(--gold-bright); stroke: var(--gold-text); stroke-width: 2; }
.spec-cab { fill: var(--ink); }
.spec-chassis, .spec-wheel { fill: var(--ink); }
.spec-dim { fill: none; stroke: var(--gold-text); stroke-width: 2; }
.spec-side text { fill: var(--gold-text); font-size: 15px; font-weight: 700; }
.spec-list div { display: flex; justify-content: space-between; gap: var(--space-4); padding-block: var(--space-2); border-top: 1px solid var(--line); }
.spec-list div:first-child { border-top: 0; }
.spec-list dt { flex: none; color: var(--ink-mute); }
.spec-list dd { margin: 0; font-weight: 600; text-align: right; }
.spec-types { display: flex; flex-wrap: wrap; grid-column: 1 / -1; gap: var(--space-2); }
.spec-types li { padding: 2px 12px; border-radius: 999px; background: var(--bg-tint); font-size: .875rem; font-weight: 600; }
@media (max-width: 760px) {
  .spec-panel { grid-template-columns: minmax(0, 1fr); padding: var(--space-4); }
  .spec-tab { padding-inline: 14px; }
  .korea-map { max-width: 320px; }
}

/* 이사 페이지 제목 옆 간편 견적 */
.quick-side { margin-top: var(--space-6); padding: var(--space-5); background: var(--white); border: 1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow-md); }
.quick-fields { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--space-3); }
.quick-fields .span-2 { grid-column: span 2; }
@media (min-width: 900px) {
  .page-head-split { display: grid; grid-template-columns: minmax(0, 1fr) 380px; column-gap: var(--space-7); align-items: center; }
  .page-head:has(.page-head-split) { padding-block: var(--space-6); }
  .page-head-split h1 { font-size: 2.75rem; }
  .quick-side { margin-top: 0; padding: var(--space-4); }
  .quick-fields { align-items: end; gap: var(--space-2) var(--space-3); }
  .quick-fields .quick-end { grid-column: auto; padding-inline: var(--space-2); font-size: .9375rem; }
  .quick-fields .field.quick-end { padding-inline: 0; }
}

/* 이사 종류 카드와 분리된 화물 구역 */
.type-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 10px; }
.type-card { display: flex; flex-direction: column; gap: 4px; padding: 8px; background: var(--white); border: 1px solid var(--line); border-radius: var(--radius); text-align: center; transition: border-color var(--fast), box-shadow var(--fast); }
.type-card:hover { border-color: var(--gold); box-shadow: var(--shadow-md); }
.type-card h3 { font-size: 1rem; line-height: 1.4; }
.type-visual { display: grid; justify-items: center; align-content: center; gap: var(--space-1); padding: 6px; border-radius: var(--radius-sm); background: var(--ink); color: var(--gold-soft); }
.type-pill { padding: 1px 10px; border-radius: 999px; background: var(--gold-bright); color: var(--gold-ink); font-size: .75rem; font-weight: 700; }
.type-icons { display: flex; gap: var(--space-2); }
.type-icons .icon { width: 22px; height: 22px; }
.type-card p { flex: 1; color: var(--ink-soft); font-size: .8125rem; line-height: 1.45; }
.type-actions { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-2); }
.type-actions .btn { min-height: 32px; padding: 4px; font-size: .8125rem; }
#services .section-head { margin-bottom: var(--space-5); }
.freight-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-4); }
.freight-grid li { padding: var(--space-5); border: 1px solid rgba(255, 255, 255, .22); border-radius: var(--radius); }
.freight-grid p { margin-top: var(--space-2); color: #D5D6D8; }
@media (max-width: 760px) {
  .type-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-3); }
  .type-card { padding: var(--space-3); }
  .type-card h3 { font-size: 1rem; }
  .type-visual { gap: var(--space-2); min-height: 88px; padding: var(--space-3) var(--space-1); }
  .type-pill { padding-inline: 8px; font-size: .75rem; }
  .type-icons { gap: var(--space-1); }
  .type-icons .icon { width: 22px; height: 22px; }
  .type-card p { font-size: .875rem; }
  #services .type-card p { display: none; }
  .type-actions { grid-template-columns: 1fr; }
  .freight-grid { grid-template-columns: 1fr; }
}

.reasons { display: grid; grid-template-columns: repeat(2, 1fr); gap: var(--space-7) var(--space-8); }
.reason { display: grid; grid-template-columns: auto 1fr; gap: var(--space-4); }
.reason .icon { width: 28px; height: 28px; margin-top: 2px; color: var(--gold-soft); }
.reason h3 { margin-bottom: var(--space-2); }
.reason p { color: #D5D6D8; }

.steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--space-5); counter-reset: step; }
.steps li { counter-increment: step; padding-top: var(--space-4); border-top: 2px solid var(--ink); }
.steps li::before { content: "0" counter(step); display: block; margin-bottom: var(--space-3); color: var(--gold-text); font-weight: 700; font-variant-numeric: tabular-nums; }
.steps h3 { margin-bottom: var(--space-2); }
.steps p { color: var(--ink-soft); }

.split { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-8); align-items: center; }
.split img { width: 100%; border-radius: var(--radius-lg); }

.cta { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-5); }
.cta h2 { max-width: 14em; }
.cta-actions { display: flex; flex-wrap: wrap; gap: var(--space-3); }
.section-ink .btn-primary { background: var(--white); color: var(--ink); }
.section-ink .btn-primary:hover { background: var(--bg-tint); }
.section-ink .btn-outline { border-color: rgba(255, 255, 255, .55); color: var(--white); }
.section-ink .btn-outline:hover { background: rgba(255, 255, 255, .1); border-color: var(--white); }

.check-list li { position: relative; padding: var(--space-3) 0 var(--space-3) 32px; border-bottom: 1px solid var(--line); }
.check-list li::before { content: ""; position: absolute; left: 4px; top: 22px; width: 14px; height: 8px; border-left: 2px solid var(--gold-text); border-bottom: 2px solid var(--gold-text); transform: rotate(-45deg); }

/* 표 */
.table-wrap { overflow-x: auto; border: 1px solid var(--line); border-radius: var(--radius); }
table { width: 100%; border-collapse: collapse; background: var(--white); }
caption { padding: var(--space-4) var(--space-5); text-align: left; font-weight: 700; }
th, td { padding: 14px var(--space-5); text-align: left; border-top: 1px solid var(--line); }
thead th { background: var(--bg-soft); font-weight: 600; font-size: .9375rem; white-space: nowrap; }
td.num, th.num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.table-note { margin-top: var(--space-3); color: var(--ink-mute); font-size: .9375rem; }

/* 계산기 */
.calc { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-7); padding: var(--space-7); background: var(--white); border: 1px solid var(--line); border-radius: var(--radius-lg); box-shadow: var(--shadow-md); }
.calc-form { display: grid; gap: var(--space-5); align-content: start; }
.calc-result { display: flex; flex-direction: column; justify-content: center; padding: var(--space-6); background: var(--bg-soft); border-radius: var(--radius); }
.calc-price { margin: var(--space-2) 0; font-size: clamp(2.25rem, 5vw, 3.25rem); font-weight: 700; letter-spacing: -.03em; font-variant-numeric: tabular-nums; line-height: 1.15; }
.calc-detail { color: var(--ink-soft); font-size: 1rem; }
.range { width: 100%; height: 44px; accent-color: var(--ink); }
.range-row { display: flex; align-items: center; gap: var(--space-3); }
.range-row .input { width: 104px; flex: none; font-variant-numeric: tabular-nums; }

/* FAQ */
.faq details { border-bottom: 1px solid var(--line); }
.faq summary { display: flex; justify-content: space-between; gap: var(--space-4); padding: var(--space-5) 0; font-weight: 600; font-size: 1.125rem; cursor: pointer; list-style: none; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; color: var(--gold-text); font-size: 1.5rem; line-height: 1; transition: transform var(--fast) var(--ease); }
.faq details[open] summary::after { transform: rotate(45deg); }
.faq p { padding-bottom: var(--space-5); color: var(--ink-soft); }

/* 견적 신청 */
.wizard { padding-block: var(--space-7) var(--space-9); background: var(--bg-soft); }
.progress { display: grid; grid-template-columns: repeat(5, 1fr); gap: var(--space-2); margin-bottom: var(--space-5); }
.progress li { padding-top: var(--space-2); border-top: 3px solid var(--line); color: var(--ink-mute); font-size: .875rem; font-weight: 500; transition: border-color var(--fast), color var(--fast); }
.progress li.is-done { border-color: var(--gold); }
.progress li[aria-current] { border-color: var(--ink); color: var(--ink); font-weight: 700; }
.panel { padding: var(--space-7); background: var(--white); border: 1px solid var(--line); border-radius: var(--radius-lg); box-shadow: var(--shadow-sm); }
.panel fieldset { min-width: 0; margin: 0; padding: 0; border: 0; }
.panel h2 { font-size: 1.625rem; margin-bottom: var(--space-2); outline: none; }
.panel-desc { color: var(--ink-soft); margin-bottom: var(--space-6); }
.stack { display: grid; gap: var(--space-5); }
.two-col { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-4); }
.panel-foot { display: flex; justify-content: space-between; gap: var(--space-3); margin-top: var(--space-7); }
.panel-foot .btn-primary { margin-left: auto; }
.service-options { display: grid; gap: var(--space-3); }
.option { display: block; margin: 0; cursor: pointer; }
.option input { position: absolute; opacity: 0; }
.option-box { display: grid; grid-template-columns: auto 1fr; gap: 2px var(--space-4); align-items: center; padding: var(--space-4) var(--space-5); border: 1px solid var(--line-strong); border-radius: var(--radius); transition: border-color var(--fast), box-shadow var(--fast), background var(--fast); }
.option-box .icon { grid-row: span 2; width: 26px; height: 26px; color: var(--gold-text); }
.option-box b { font-size: 1.0625rem; }
.option-box small { color: var(--ink-mute); font-size: .9375rem; }
.option:hover .option-box { border-color: var(--ink); }
.option input:checked + .option-box { border-color: var(--ink); background: var(--bg-soft); box-shadow: inset 0 0 0 1px var(--ink); }
.option input:focus-visible + .option-box { outline: 2px solid var(--ink); outline-offset: 2px; }
.check { display: flex; align-items: flex-start; gap: 10px; min-height: 44px; padding-top: 10px; font-weight: 400; cursor: pointer; }
.check input { width: 22px; height: 22px; margin: 2px 0 0; flex: none; accent-color: var(--ink); }
.photos { display: flex; flex-wrap: wrap; gap: var(--space-3); }
.photo-item { position: relative; width: 108px; height: 108px; }
.photo-item img { width: 100%; height: 100%; object-fit: cover; border-radius: var(--radius-sm); }
.photo-item button { position: absolute; top: -8px; right: -8px; display: grid; place-items: center; width: 32px; height: 32px; padding: 0; background: var(--ink); color: var(--white); border: 2px solid var(--white); border-radius: 50%; }
.photo-add { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; width: 108px; height: 108px; margin: 0; border: 1px dashed var(--line-strong); border-radius: var(--radius-sm); color: var(--ink-soft); font-size: .9375rem; font-weight: 500; cursor: pointer; }
.photo-add:hover { border-color: var(--ink); }
.photo-add:focus-within { outline: 2px solid var(--ink); outline-offset: 2px; }
.summary { padding: var(--space-4) var(--space-5); background: var(--bg-soft); border-radius: var(--radius-sm); }
.summary div { display: grid; grid-template-columns: 88px 1fr; gap: var(--space-3); padding-block: 4px; }
.summary dt { color: var(--ink-mute); }
.result-box { text-align: center; }
.result-icon { display: grid; place-items: center; width: 64px; height: 64px; margin: 0 auto var(--space-4); border-radius: 50%; background: var(--bg-tint); color: var(--ok); }
.result-icon .icon { width: 32px; height: 32px; }
.order-no { display: inline-block; margin: var(--space-4) 0; padding: 8px 18px; background: var(--bg-soft); border-radius: var(--radius-sm); font-size: 1.25rem; font-weight: 700; font-variant-numeric: tabular-nums; letter-spacing: .02em; }
.honeypot { position: absolute; left: -9999px; }
.addr-dialog { width: min(100% - 32px, 520px); height: min(100dvh - 64px, 560px); padding: 0; border: 0; border-radius: var(--radius); box-shadow: var(--shadow-lg); }
.addr-dialog::backdrop { background: rgba(35, 38, 43, .55); }
.addr-head { display: flex; align-items: center; justify-content: space-between; padding: 8px 8px 8px 20px; border-bottom: 1px solid var(--line); font-weight: 700; }
.addr-head button { display: grid; place-items: center; width: 44px; height: 44px; border: 0; background: none; }
.addr-embed { height: calc(100% - 61px); }
.addr-embed p { padding: var(--space-5); color: var(--ink-soft); }

/* 약관 */
.legal { padding-block: var(--space-7) var(--space-9); }
.legal h2 { font-size: 1.375rem; margin: var(--space-7) 0 var(--space-3); }
.legal h3 { font-size: 1.0625rem; margin: var(--space-5) 0 var(--space-2); }
.legal p, .legal li { color: var(--ink-soft); }
.legal p { margin-bottom: var(--space-2); }
.legal ol, .legal ul { margin-bottom: var(--space-3); padding-left: 1.4em; }
.legal ol { list-style: decimal; }
.legal ul { list-style: disc; }

/* 푸터 */
.site-footer { padding-block: var(--space-8) var(--space-6); background: var(--bg-soft); color: var(--ink-soft); font-size: .9375rem; }
.footer-grid { display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--space-6); }
.footer-grid nav { display: flex; gap: var(--space-5); }
.footer-grid nav a { padding-block: 10px; }
.logo-footer { width: auto; height: 96px; margin-bottom: var(--space-4); }
.copyright { margin-top: var(--space-6); color: var(--ink-mute); }

/* 하단 고정 바 */
.bottom-bar {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 30;
  display: grid; grid-template-columns: 1fr 1fr 1.6fr;
  min-height: var(--bar-h); padding-bottom: env(safe-area-inset-bottom);
  background: var(--glass);
  -webkit-backdrop-filter: blur(16px) saturate(1.4);
  backdrop-filter: blur(16px) saturate(1.4);
  border-top: 1px solid rgba(35, 38, 43, .08);
}
.bottom-bar a { position: relative; display: flex; align-items: center; justify-content: center; gap: 8px; overflow: hidden; font-weight: 600; text-decoration: none; }
.bottom-bar a[href^="tel"] { margin: 8px 4px 8px 12px; border-radius: 999px; background: var(--gold-metal); box-shadow: 0 0 0 2px var(--gold-text), inset 0 0 0 2px rgba(255, 255, 255, .55); color: var(--gold-ink); font-weight: 700; }
.bottom-bar a.is-primary { margin: 8px 12px 8px 4px; border-radius: 999px; background: var(--ink); box-shadow: 0 0 0 2px var(--gold); color: var(--gold-bright); }

/* 등장 효과 */
.js .reveal { opacity: 0; transform: translateY(18px); transition: opacity var(--slow) var(--ease), transform var(--slow) var(--ease); transition-delay: calc(var(--i, 0) * 60ms); }
.js .reveal.is-in { opacity: 1; transform: none; }

@media (max-width: 1080px) {
  .nav { display: none; position: absolute; left: 0; right: 0; top: 100%; flex-direction: column; gap: 0; margin: 0; padding: var(--space-2) 20px var(--space-4); background: var(--white); border-bottom: 1px solid var(--line); box-shadow: var(--shadow-md); }
  .nav.is-open { display: flex; }
  .nav a { min-height: 48px; display: flex; align-items: center; }
  .menu-btn { display: inline-flex; }
  .hero-grid, .split { grid-template-columns: 1fr; gap: var(--space-7); }
  .quote-card { left: var(--space-5); }
  .grid-4, .steps { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 760px) {
  body { font-size: 16px; }
  .section { padding-block: var(--space-9); }
  .page-head { padding-block: var(--space-8) var(--space-7); }
  .hero { padding-block: var(--space-4) var(--space-8); }
  .hero-grid { gap: var(--space-5); }
  /* 휴대폰 순서: 슬라이드 → 제목 → 간편 견적 */
  .hero-visual { display: contents; }
  .hero-slider { order: -1; aspect-ratio: 4 / 3; }
  .quote-card { position: static; }
  .header-tel { display: none; }
  .grid-3, .grid-2, .reasons, .calc, .two-col { grid-template-columns: 1fr; }
  .fleet, .certs { grid-template-columns: repeat(2, 1fr); }
  .steps, .grid-4 { grid-template-columns: 1fr; }
  .card-link { min-height: 0; }
  .calc, .panel { padding: var(--space-5); }
  .progress li { font-size: 0; }
  .progress li[aria-current] { font-size: .875rem; }
  .progress { grid-template-columns: repeat(5, auto); }
  .progress li[aria-current] { min-width: 96px; }
  .section-head { margin-bottom: var(--space-7); }
  th, td { padding-inline: var(--space-4); }
}
/* 우측 상담 박스: 넓은 화면에서만 쓰고, 본문과 겹치지 않게 양쪽 여백을 확보한다 */
.dock { display: none; }
@media (min-width: 1200px) {
  .bottom-bar { display: none; }
  body { padding-bottom: 0; }
  .wrap { width: min(100% - 216px, var(--wrap)); }
  .dock { position: fixed; z-index: 40; top: 50%; right: 12px; display: flex; flex-direction: column; width: 90px; transform: translateY(-50%); overflow: hidden; border: 3px solid transparent; background: linear-gradient(var(--ink), var(--ink)) padding-box, var(--gold-ring) border-box; border-radius: 28px; box-shadow: 0 0 0 1px var(--gold-text), var(--gold-glow), var(--shadow-lg); }
  .dock a, .dock span { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: var(--space-4) 4px; color: var(--white); font-size: .75rem; font-weight: 600; line-height: 1.3; text-align: center; text-decoration: none; }
  .dock > * + * { border-top: 1px solid rgba(255, 255, 255, .14); }
  .dock a:hover { background: rgba(255, 255, 255, .1); }
  .dock a:focus-visible { outline-color: var(--white); outline-offset: -3px; }
  .dock .icon { width: 22px; height: 22px; }
  .dock .is-off { color: #C9CBCE; }
  .dock small { color: var(--gold-soft); font-size: .6875rem; font-weight: 500; }
  .dock a[href^="tel"] { position: relative; overflow: hidden; background: var(--gold-metal); color: var(--gold-ink); font-weight: 700; }
  .dock a[href^="tel"]:hover { background: var(--gold-metal); filter: brightness(1.06); }
  .dock a[href^="tel"]:focus-visible { outline-color: var(--ink); }
  .dock a[href^="tel"] small { color: var(--gold-ink); font-size: .75rem; font-weight: 700; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition-duration: 1ms !important; animation-duration: 1ms !important; }
  .js .reveal { opacity: 1; transform: none; }
  .hero-slider .hero-photo { animation: none !important; }
  .band-title, .medal::after, .logo-shine, .logo-shine::after, .header-tel::after, .header-cta::after, .dock a::after, .bottom-bar a::after { animation: none !important; }
}
/* 손가락으로 누르는 화면: 버튼과 링크를 44px 이상으로 */
@media (pointer: coarse) {
  .logo, .header-tel, .link-more { min-height: 44px; }
  .hero-dots button { height: 44px; }
  .hero-toggle { width: 44px; height: 44px; }
  .strip-controls { height: 44px; }
  .strip-controls button { width: 44px; height: 44px; }
  .type-actions .btn { min-height: 44px; }
}
/* 휴대폰: 표는 행마다 카드로 풀고, 슬라이드 설명은 조작 버튼과 겹치지 않게 아래로 내린다 */
@media (max-width: 760px) {
  .table-wrap.is-stacked { overflow: visible; border: 0; border-radius: 0; }
  .is-stacked table, .is-stacked tbody, .is-stacked caption { display: block; background: none; }
  .is-stacked thead { display: none; }
  .is-stacked caption { padding: 0 0 var(--space-3); }
  .is-stacked tr { display: grid; grid-template-columns: 1fr auto; column-gap: var(--space-4); margin-bottom: var(--space-3); padding: var(--space-3) var(--space-4); background: var(--white); border: 1px solid var(--line); border-radius: var(--radius-sm); }
  .is-stacked th[scope="row"] { padding: 0 0 var(--space-2); border: 0; }
  .is-stacked td { display: flex; grid-column: 1 / -1; justify-content: space-between; gap: var(--space-4); padding-inline: 0; padding-block: var(--space-2); text-align: right; white-space: normal; }
  .is-stacked td::before { content: attr(data-label); flex: none; color: var(--ink-mute); }
  .is-stacked th + td.num { grid-column: 2; padding-block: 0 var(--space-2); border: 0; font-weight: 700; }
  .is-stacked th + td.num::before { content: none; }
  .is-stacked td:empty { display: none; }
  .hero-caption { top: auto; bottom: var(--space-4); }
  .hero-temp { top: auto; bottom: 52px; }
}
/* 휴대폰을 가로로 돌렸을 때: 고정 바가 화면을 덮지 않게 줄인다 */
@media (max-height: 500px) and (max-width: 1199px) {
  :root { --bar-h: 56px; }
  .site-header { position: static; }
  .bottom-bar a[href^="tel"], .bottom-bar a.is-primary { margin-block: 4px; }
}
@media print {
  .site-header, .band, .bottom-bar, .dock, .notice { display: none; }
}

/* 데스크톱 히어로: 넓은 사진 아래쪽에 가로형 견적 바를 겹친다 */
@media (min-width: 1081px) {
  .hero { padding-block: var(--space-8) var(--space-9); }
  .hero-grid { grid-template-columns: 1fr; gap: var(--space-7); }
  .hero-copy { display: grid; grid-template-columns: 1.15fr .85fr; column-gap: var(--space-8); align-items: end; }
  .hero h1 { font-size: 4rem; }
  .hero-duties { margin-top: 0; }
  .hero-slider { aspect-ratio: 2.35 / 1; }
  .hero-visual { padding-bottom: var(--space-8); }
  .quote-card { left: var(--space-6); right: var(--space-6); }
  .quote-title { margin-bottom: var(--space-2); }
  .quote-grid { grid-template-columns: 1.9fr 1fr 1fr 1.1fr auto; align-items: end; }
  .quote-grid .span-2 { grid-column: auto; }
  .quote-grid .seg span { padding-inline: 4px; font-size: .875rem; white-space: nowrap; }
}

.field label.check { display: flex; margin: 0; font-size: 1rem; font-weight: 400; }
#done:focus, #fallback:focus { outline: none; }

/* 휴대폰은 하단 바에 견적 버튼이 있어 헤더에서 뺀다 */
@media (max-width: 760px) {
  .header-cta { display: none; }
  .logo-mark { height: 32px; }
}