/* ===== default theme — homewindows 톤 (brand 색은 head의 --brand 주입) ===== */
:root{
  --bg:#ffffff;
  --bg-alt:#f6f8fa;
  --bg-soft:#eef1f5;
  --text:#1f2328;
  --muted:#6b7280;
  --line:#e5e7eb;
  --radius:8px;
  --shadow:0 2px 10px rgba(0,0,0,.07);
  --space:64px;
  --maxw:1100px;
}
body{font-family:-apple-system,"Segoe UI",Roboto,"Malgun Gothic","Apple SD Gothic Neo",sans-serif;font-size:15px}

/* --- 헤더 --- */
.site-header{backdrop-filter:saturate(160%) blur(4px);background:rgba(255,255,255,.96)}

/* --- 히어로 --- */
.hero{background:linear-gradient(160deg,var(--bg-alt) 0%,var(--bg) 60%)}
.hero-inner h1{font-size:clamp(26px,4.5vw,46px);font-weight:800;letter-spacing:-.03em}
.hero-banner{border-radius:12px;box-shadow:0 8px 32px rgba(0,0,0,.12)}

/* --- 버튼 --- */
.btn-primary{box-shadow:0 2px 8px color-mix(in srgb,var(--brand) 25%,transparent);transition:opacity .15s,transform .1s,box-shadow .15s}
.btn-primary:hover{opacity:.92;transform:translateY(-1px);box-shadow:0 4px 14px color-mix(in srgb,var(--brand) 30%,transparent)}
.btn-outline{border-color:var(--brand);color:var(--brand)}

/* --- 섹션 타이틀 --- */
.section{padding:var(--space) 0}
.section-title{font-size:clamp(20px,2.8vw,28px);font-weight:800;letter-spacing:-.03em;position:relative;margin-bottom:24px}
.section-title::after{content:'';display:block;width:32px;height:3px;background:var(--brand);border-radius:2px;margin-top:8px}

/* --- 카드 --- */
.card{transition:box-shadow .18s ease, transform .18s ease}
.card:hover{box-shadow:0 8px 28px rgba(0,0,0,.09);transform:translateY(-3px)}

/* --- CTA 밴드 --- */
.cta-band{background:linear-gradient(120deg,var(--brand),color-mix(in srgb,var(--brand) 70%,#000 30%))}

/* --- 플로팅 버튼 --- */
.float-btn{box-shadow:0 4px 16px rgba(0,0,0,.18)}
.float-quote{box-shadow:0 6px 22px color-mix(in srgb,var(--brand) 40%,transparent)}

/* --- 상담현황 테이블 --- */
.status-table th{letter-spacing:.03em}
.status-badge.req{background:#fff8e6;color:#7a5b00}
.status-badge.done{background:#e6f7ee;color:#167f3b}

/* --- 시공사례/포트폴리오 --- */
.ba-label{border-radius:6px}
.after-label{background:var(--brand)}

/* --- 후기 카드 --- */
.review-card .stars{font-size:18px}

/* --- 이벤트 --- */
.event-badge{border-radius:6px}

/* --- FAQ --- */
.faq-item:has([aria-expanded="true"]){border-color:var(--brand)}
.faq-qmark{background:var(--brand)}

/* --- 타임라인 --- */
.timeline-num{background:var(--brand)}

/* --- 견적폼 --- */
.form input:focus,.form select:focus,.form textarea:focus{border-color:var(--brand)}
.agree-label{border-radius:8px}

/* --- 팝업 --- */
.popup-modal{border-radius:14px}

/* --- SNS --- */
.sns-link{border-radius:24px}
.sns-link:hover{color:var(--brand)}

/* --- 포커스 --- */
:focus-visible{outline:2px solid var(--brand);outline-offset:2px}

/* --- 반응형 --- */
@media (max-width:767px){
  .hero{padding:44px 0 56px}
  .section{padding:44px 0}
  .cta-band{padding:52px 0}
}
@media (min-width:768px){
  .hero-inner h1{font-size:clamp(32px,4vw,46px)}
}
@media (min-width:1024px){
  .hero{padding:calc(var(--space)*1.25) 0 calc(var(--space)*1.4)}
  .footer-cols{grid-template-columns:1.6fr 1fr}
}