/* ===== 현장 브랜드: 천안아산역 이편한세상시티 (로고 네이비 · e편한세상 오렌지) — 기준 사이트 CSS 위에 색만 덮어씀 ===== */
:root {
  --main: #14213d;
  --point: #ec672b;
  --line: #e1e4ea;
  --bg-alt: #f3f4f7;
  --reg-dark1: #18264a;
  --reg-dark2: #0c1428;
  --reg-gold: #f39a6b;
  --hero-title: #14213d;
  --sub: #5d6a83;
}
.tab-btn:hover { background: rgba(20,33,61,.06); }
.btn-primary { box-shadow: none; }
.info-table th { background: #f6f7fa; }

@media (min-width: 769px) {
  body.home .hero-sky { background: #6b86a8; }
  .hero-sub { background: linear-gradient(90deg, rgba(20,33,61,.88), rgba(20,33,61,.6)) !important; }
  .hero-sub span::before { background: #f39a6b; }
}

/* 노을 하늘 → 흰 글씨 + 진한 그림자 */
@media (min-width: 769px) {
  .hero-copy { color: #fff; }
  .hero-copy h1 { color: #fff !important; text-shadow: 0 0 3px rgba(10,14,24,.75), 0 3px 10px rgba(10,14,24,.6), 0 6px 30px rgba(10,14,24,.55) !important; }
  .hero-lead, body.home .hero-kicker { color: #fff !important; font-weight: 700 !important; text-shadow: 0 0 2px rgba(10,14,24,.95), 0 0 6px rgba(10,14,24,.85), 0 0 18px rgba(10,14,24,.7) !important; }
  .hero-lead { font-size: 23px !important; }
  body.home .hero-kicker { color: #ffd2b8 !important; font-size: 15px !important; }
}

/* 로고 (가로형) */
.logo img { height: 62px; }
/* 첫 화면 투명 헤더: 타워 윗부분과 겹쳐도 로고·메뉴가 읽히도록 위쪽만 은은하게 어둡게 */
@media (min-width: 769px) {
  body.home .site-header::after { content: ""; position: absolute; left: 0; right: 0; top: 0; height: calc(100% + 70px); background: linear-gradient(rgba(10,18,38,.66) 0%, rgba(10,18,38,.48) 55%, rgba(10,18,38,0) 100%); pointer-events: none; z-index: -2; transition: opacity .45s ease; }
  body.home .site-header.solid::after, body.home .site-header.mega-open::after { opacity: 0; }
  body.home .site-header:not(.solid):not(.mega-open) .gnb > ul > li > a { font-weight: 700; text-shadow: 0 0 2px rgba(5,10,24,.9), 0 1px 10px rgba(5,10,24,.75) !important; }
  body.home .site-header:not(.solid):not(.mega-open) .logo img { filter: brightness(0) invert(1) drop-shadow(0 0 1px rgba(5,10,24,.9)) drop-shadow(0 1px 8px rgba(5,10,24,.7)) !important; }
}
/* 건물을 오른쪽으로 → 왼쪽 글씨 자리 확보 */
@media (min-width: 769px) { body.home .hero-img { object-position: 0% 30%; } }
.site-footer .footer-logo { height: 30px !important; }
@media (max-width: 768px) { .logo img { height: 38px; } }

/* 사업개요 */
.biz-grid .biz-img img { width: 100%; height: 100%; object-fit: cover; }
/* PC: 사진 높이 = 오른쪽(문구+표) 높이 — 사진이 줄의 높이를 늘리지 않도록 절대배치 */
@media (min-width: 1025px) {
  .biz-grid { align-items: stretch; }
  .biz-grid .biz-img { position: relative; margin: 0; overflow: hidden; min-height: 0; }
  .biz-grid .biz-img img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 35%; }
  .biz-grid > div { align-self: start; }
}
/* 태블릿·모바일: 사진이 표 위로 쌓일 때 너무 길지 않게 */
@media (max-width: 1024px) { .biz-grid .biz-img img { aspect-ratio: 4 / 3; height: auto; object-fit: cover; object-position: center 35%; } }
.biz-slogan { margin: 0 0 16px; padding: 16px 20px; background: var(--main); color: #fff; font-size: 16px; line-height: 1.6; }
.biz-slogan strong { color: #ffb48e; font-family: 'Noto Serif KR', serif; font-weight: 600; font-size: 20px; }

/* 프리미엄: 사진을 카드 묶음과 같은 폭으로 */
.figure.premium-photo { max-width: var(--figure-max); margin: 0 auto; }
.figure.premium-photo img { width: 100%; display: block; }
.premium-grid.five { max-width: var(--figure-max); margin-left: auto; margin-right: auto; }
/* 프리미엄 5 → 3 + 2 */
.premium-grid.five { grid-template-columns: repeat(6, 1fr); margin-top: 26px; }
.premium-grid.five .pcard { grid-column: span 2; }
.premium-grid.five .pcard:nth-child(4) { grid-column: 2 / span 2; }
@media (max-width: 1024px) { .premium-grid.five { grid-template-columns: 1fr 1fr; } .premium-grid.five .pcard, .premium-grid.five .pcard:nth-child(4) { grid-column: auto; } }
@media (max-width: 768px) { .premium-grid.five { grid-template-columns: 1fr; } }

/* 커뮤니티 5개 / 시스템 8개 */
#complex .point-grid .pcard h3 small { font-size: .75em; font-weight: 500; color: var(--muted); }
[data-panel="c-community"] .point-grid { grid-template-columns: repeat(5, 1fr); }
@media (max-width: 1024px) { [data-panel="c-community"] .point-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 768px) { [data-panel="c-community"] .point-grid { grid-template-columns: 1fr; } }
.sys-head { display: grid; grid-template-columns: 1.1fr 1fr; gap: 24px; align-items: stretch; max-width: var(--figure-max); margin: 0 auto; }
.sys-head .figure { margin: 0; max-width: none; }
.sys-head .figure img { width: 100%; height: 100%; object-fit: cover; }
.sys-head .intro-card { margin: 0; display: flex; flex-direction: column; justify-content: center; }
@media (max-width: 768px) { .sys-head { grid-template-columns: 1fr; gap: 14px; } }

/* 타입 색 (08_동호수배치도 색) */
.type-table .t84a, .type-legend i.t84a { background: #6cc08b; }
.type-table .t84b, .type-legend i.t84b { background: #f8bd6d; }
.type-table .t84c, .type-legend i.t84c { background: #a996cc; color: #fff; }
.type-table .t84d, .type-legend i.t84d { background: #4a8fd4; color: #fff; }

/* ===== 호실배치도: 흰 테두리 이미지 + 동별 표 ===== */
.unit-split { max-width: 820px; margin: 0 auto 40px; }
.unit-frame img { background: #fff; padding: 26px; border: 1px solid #d6dae2 !important; }
.dong-grid { display: grid; gap: 14px; margin-top: 16px; }
.dong-grid.c2 { grid-template-columns: repeat(2, 1fr); }
.dong-card { background: #fff; border: 1px solid var(--line); }
.type-table.dong-mini { min-width: 0; width: 100%; border-top: 0; font-size: 14px; table-layout: fixed; }
.type-table.dong-mini caption { caption-side: top; padding: 10px 6px; background: var(--main); color: #fff; font-weight: 800; font-size: 16px; }
.type-table.dong-mini caption small { font-weight: 500; opacity: .85; }
.type-table.dong-mini th, .type-table.dong-mini td { padding: 8px 2px; }
.type-table.dong-mini th { width: 48px; font-size: 12.5px; }
.type-table.dong-mini td[class^="t"] { font-weight: 800; }
.type-legend { list-style: none; display: flex; flex-wrap: wrap; justify-content: center; gap: 8px 18px; margin: 0 auto 18px; padding: 0; font-size: 14px; color: #444; }
.type-legend li { display: flex; align-items: center; gap: 6px; }
.type-legend i { width: 14px; height: 14px; display: inline-block; }
.type-legend li.sum { font-weight: 800; color: var(--main); }
.unit-note { margin: 12px 0 0; text-align: center; font-size: 14px; color: var(--muted); }
@media (max-width: 768px) {
  .unit-frame img { padding: 10px; }
  .dong-grid.c2 { grid-template-columns: 1fr; }
}

/* ===== 평면: 면적 정보 카드 (이미지 속 면적 박스 → HTML) ===== */
.plan-info { max-width: 900px; margin: 0 auto 18px; display: flex; align-items: stretch; background: #fff; border: 1px solid var(--line); }
.plan-info .pi-name { flex: 0 0 auto; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; padding: 16px 26px; background: var(--main); color: #fff; }
.plan-info .pi-name b { font-size: 34px; line-height: 1; font-weight: 800; letter-spacing: -.01em; }
.plan-info .pi-name span { font-size: 12px; letter-spacing: .25em; opacity: .8; }
.plan-info .pi-name em { font-style: normal; margin-top: 6px; padding: 2px 10px; background: var(--point); font-size: 13px; font-weight: 700; }
.plan-info dl { flex: 1; margin: 0; display: grid; grid-template-columns: repeat(5, 1fr); }
.plan-info dl div { display: flex; flex-direction: column; justify-content: center; align-items: center; padding: 12px 6px; border-left: 1px solid var(--line); }
.plan-info dt { font-size: 13px; color: var(--muted); }
.plan-info dd { margin: 4px 0 0; font-size: 16px; font-weight: 700; color: var(--main); }
.plan-info dl div.em dd { color: var(--point); }
.figure.plan { max-width: 900px; }
@media (max-width: 768px) {
  .plan-info { flex-direction: column; }
  .plan-info .pi-name { flex-direction: row; gap: 8px; padding: 12px; }
  .plan-info .pi-name b { font-size: 26px; }
  .plan-info .pi-name em { margin: 0 0 0 4px; }
  .plan-info dl { grid-template-columns: repeat(2, 1fr); }
  .plan-info dl div { border-left: 0; border-top: 1px solid var(--line); }
  .plan-info dl div.em { grid-column: 1 / -1; }
}