/* 보도블럭시공평당가격 — 전용 스타일 (팔레트: #3A2618 / #FDF6EC / #C1683A, 타입스케일 1.250, 패딩 80px, 라운드 999px 계열) */
@import url('https://fastly.jsdelivr.net/gh/webfontworld/cafe24/Cafe24Ssurround.css');
@import url('https://cdn.jsdelivr.net/gh/spoqa/spoqa-han-sans@latest/css/SpoqaHanSansNeo.css');

:root{
  --dp-price-primary:#3A2618;
  --dp-price-bg:#FDF6EC;
  --dp-price-accent:#C1683A;
  --dp-price-radius:999px;
  --dp-price-radius-box:28px;
  --dp-price-font-head:"Cafe24 Ssurround","Pretendard","Noto Sans KR",sans-serif;
  --dp-price-font-body:"Spoqa Han Sans Neo","Pretendard","Noto Sans KR",sans-serif;
}

.site-header{position:sticky;top:0;z-index:60;}

/* 타입 스케일 1.250 기준 */
.dp-price-hero h1{font-family:var(--dp-price-font-head);font-size:clamp(30px,4.2vw,42px);}
.section-head h2{font-family:var(--dp-price-font-head);font-size:27px;}
.guide-item h3{font-family:var(--dp-price-font-head);font-size:17px;}
.dp-price-lead{font-family:var(--dp-price-font-body);font-size:19px;line-height:1.9;color:var(--dp-price-primary);font-weight:600;}
.dp-price-body{font-family:var(--dp-price-font-body);font-size:16.5px;line-height:1.85;color:#4a3626;max-width:820px;}
.dp-price-body + .dp-price-body{margin-top:20px;}
.dp-price-eyebrow{background:#f3ddc8;color:#8a4a20;}

/* 섹션 패딩 80px 계열 */
.section{padding:80px 0;}
@media (max-width:768px){.section{padding:52px 0;}}

/* 히어로: 격자 스케일 */
.dp-price-hero{background:linear-gradient(180deg,var(--dp-price-primary) 0%,#221609 100%);}
.dp-price-hero-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:40px;align-items:center;}
.dp-price-hero-text p{font-family:var(--dp-price-font-body);}
.dp-price-hero .btn-primary{background:var(--dp-price-accent);color:#fff;border-radius:var(--dp-price-radius);box-shadow:0 10px 24px rgba(193,104,58,.4);}
.dp-price-hero .btn-primary:hover{background:#a5572f;}
.dp-price-hero .btn-outline{border-radius:var(--dp-price-radius);}

.dp-price-scale{
  background:var(--dp-price-bg);
  border-radius:var(--dp-price-radius-box);
  padding:28px;
  text-align:center;
}
.dp-price-scale-label{display:block;font-size:13px;font-weight:700;letter-spacing:.04em;color:var(--dp-price-accent);margin-bottom:16px;}
.dp-price-scale-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:8px;}
.dp-price-scale-grid span{
  display:block;aspect-ratio:1/1;border-radius:6px;
  background:var(--dp-price-accent);opacity:.35;
}
.dp-price-scale-grid span:nth-child(4n+1){opacity:.9;}
.dp-price-scale-grid span:nth-child(3n+2){opacity:.6;}
.dp-price-scale-note{display:block;margin-top:16px;font-size:12.5px;color:#7a5c40;}

/* SVG 도식 */
.dp-price-svg{width:100%;height:auto;background:var(--dp-price-bg);border-radius:var(--dp-price-radius-box);padding:12px;}

/* 표 */
.dp-price-table-wrap{overflow-x:auto;border-radius:var(--dp-price-radius-box);border:1px solid #ecdcc4;}
.dp-price-table{width:100%;border-collapse:collapse;min-width:520px;background:#fff;}
.dp-price-table caption{text-align:left;font-size:14px;font-weight:700;color:var(--dp-price-primary);padding:14px 20px;background:#f6ead8;}
.dp-price-table th,.dp-price-table td{padding:14px 20px;font-size:15px;text-align:left;border-bottom:1px solid #f0e2cd;}
.dp-price-table th{background:var(--dp-price-primary);color:#fff;font-weight:700;}
.dp-price-table th:first-child{border-top-left-radius:var(--dp-price-radius-box);}
.dp-price-table th:last-child{border-top-right-radius:var(--dp-price-radius-box);}
.dp-price-table tbody tr:last-child td{border-bottom:none;}
.dp-price-table-note{margin-top:14px;font-size:13.5px;color:#7a5c40;}

/* 사진 캡션 */
.photo-caption{margin-top:8px;font-size:13.5px;font-weight:700;color:var(--dp-price-primary);text-align:center;}
.process-item{border-radius:var(--dp-price-radius-box);overflow:hidden;}

/* 접근성 · 모션 */
a:focus-visible,button:focus-visible{outline:3px solid var(--dp-price-accent);outline-offset:2px;}
@media (prefers-reduced-motion:reduce){.process-item img{transition:none;}}

@media (max-width:1024px){
  .dp-price-hero-grid{grid-template-columns:1fr;}
}

/* footer가 4열(브랜드/바로가기/관련페이지/문의)이라 전역 3열 정의에 최소 오버라이드 */
.footer-grid{grid-template-columns:1.3fr 1fr 1fr 1fr;}
@media (max-width:1024px){.footer-grid{grid-template-columns:1fr 1fr;}}
@media (max-width:768px){.footer-grid{grid-template-columns:1fr;}}
