/* 보도블럭시공투수블럭 — 전용 스타일 (팔레트: #0F4C5C / #F0FAF9 / #2EC4B6, 타입스케일 1.414, 패딩 120px, 라운드 4px) */
@import url('https://fonts.googleapis.com/css2?family=Gothic+A1:wght@400;500;700;800&display=swap');

:root{
  --dp-perm-primary:#0F4C5C;
  --dp-perm-bg:#F0FAF9;
  --dp-perm-accent:#2EC4B6;
  --dp-perm-font-head:"Gothic A1","Pretendard","Noto Sans KR",sans-serif;
  --dp-perm-font-body:"Pretendard","Noto Sans KR",sans-serif;
  font-display:swap;
}

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

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

h1,h2,h3{font-family:var(--dp-perm-font-head);}
.section-head h2{font-size:clamp(27px,3.8vw,38px);}

/* 히어로: 물 흐름 모티프 배경 */
.dp-perm-hero{
  background-color:var(--dp-perm-primary);
  background-image:
    repeating-linear-gradient(100deg, rgba(46,196,182,.16) 0px, rgba(46,196,182,.16) 2px, transparent 2px, transparent 34px),
    repeating-linear-gradient(80deg, rgba(240,250,249,.08) 0px, rgba(240,250,249,.08) 2px, transparent 2px, transparent 46px),
    linear-gradient(180deg,#0d3f4c 0%,#082a33 100%);
  background-size:220% 220%, 220% 220%, cover;
  animation:dp-perm-flow 16s linear infinite;
}
@keyframes dp-perm-flow{
  0%{background-position:0 0, 0 0, center;}
  100%{background-position:-300px 300px, 300px -300px, center;}
}
@media (prefers-reduced-motion:reduce){
  .dp-perm-hero{animation:none;}
}
.dp-perm-hero h1{font-size:clamp(28px,4.8vw,46px);}
.dp-perm-hero .btn-primary{background:var(--dp-perm-accent);color:#06322e;border-radius:4px;box-shadow:0 10px 24px rgba(46,196,182,.35);}
.dp-perm-hero .btn-primary:hover{background:#25aa9d;}
.dp-perm-hero .btn-outline{border-radius:4px;}

/* 본문 */
.dp-perm-body{font-family:var(--dp-perm-font-body);font-size:17px;line-height:1.85;color:#1c3a40;max-width:820px;}
.dp-perm-body + .dp-perm-body{margin-top:20px;}
.dp-perm-lead{font-family:var(--dp-perm-font-body);font-size:19px;line-height:1.9;color:var(--dp-perm-primary);font-weight:600;}
.dp-perm-eyebrow{background:#dcf3f0;color:#0d7266;border-radius:4px;}

.dp-perm-svg{width:100%;height:auto;background:var(--dp-perm-bg);border-radius:4px;padding:12px;margin-top:24px;}

.dp-perm-table-wrap{overflow-x:auto;border-radius:4px;border:1px solid #d6ece9;}
.dp-perm-table{width:100%;border-collapse:collapse;min-width:560px;background:#fff;}
.dp-perm-table caption{text-align:left;font-size:14px;font-weight:700;color:var(--dp-perm-primary);padding:16px 20px;background:#dcf3f0;}
.dp-perm-table th,.dp-perm-table td{padding:14px 18px;font-size:15px;text-align:left;border-bottom:1px solid #dff2ef;}
.dp-perm-table th{background:var(--dp-perm-primary);color:#fff;font-weight:700;}
.dp-perm-table tbody tr:last-child td{border-bottom:none;}
.dp-perm-table-note{margin-top:14px;font-size:13.5px;color:#3d5c60;}

.photo-caption{margin-top:8px;font-size:13.5px;font-weight:700;color:var(--dp-perm-primary);text-align:center;}
.process-item{border-radius:4px;}
.guide-item{border-radius:4px;}

a:focus-visible,button:focus-visible{outline:3px solid var(--dp-perm-accent);outline-offset:2px;}
@media (prefers-reduced-motion:reduce){.process-item img{transition:none;}}

.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;}}