/* drying.css — 팔레트: #FBFAF3/#FFFFFF/#17324D/#B8901A, Paperlogy/Nanum Barun Gothic, 좌측 세로형 헤더 + 매거진 2단 컬럼 */
:root{
  --bg:#FBFAF3; --surface:#FFFFFF; --text:#17324D; --accent:#B8901A;
  --radius:0px; --radius-img:18px; --maxw:800px; --header-w:230px;
}
*{ box-sizing:border-box; }
html{ font-display:swap; }
body{
  background:var(--bg); color:var(--text); line-height:1.8;
  font-family:'NanumBarunGothic',-apple-system,'Malgun Gothic',sans-serif;
  overflow-x:hidden;
}
h1,h2,h3{
  font-family:'Paperlogy','NanumBarunGothic',-apple-system,'Malgun Gothic',sans-serif;
  font-weight:700; letter-spacing:-.01em; color:var(--text);
}
a{ color:var(--text); }
:focus-visible{ outline:3px solid var(--accent); outline-offset:2px; }

.skip-link{ position:absolute; left:-999px; top:0; background:var(--text); color:#fff; padding:.6em 1em; z-index:100; }
.skip-link:focus-visible{ left:1rem; top:1rem; }

.page{ display:flex; min-height:100vh; align-items:flex-start; }

/* 헤더 — 좌측 세로 배치, 데스크톱에서 sticky 사이드 컬럼 */
.site-header{
  flex:none; width:var(--header-w); min-height:100vh; position:sticky; top:0;
  background:var(--surface); border-right:1px solid #ece6d4; padding:32px 22px;
}
.header-inner{ display:flex; flex-direction:column; align-items:flex-start; gap:26px; height:100%; }
.wordmark{ font-family:'Paperlogy','NanumBarunGothic',sans-serif; font-weight:700; font-size:1.15rem; color:var(--text); padding-left:14px; border-left:4px solid var(--accent); }
.main-nav{ display:flex; flex-direction:column; gap:14px; font-size:.92rem; }
.main-nav a{ color:#3d5470; padding-bottom:2px; border-bottom:1px solid transparent; width:fit-content; }
.main-nav a:hover, .main-nav a:focus-visible{ color:var(--text); border-color:var(--accent); }
.site-header .cta-tel{
  margin-top:auto; display:block; width:100%; text-align:center;
  background:var(--text); color:#fff; font-weight:700; font-size:.92rem;
  padding:12px 10px; border-radius:var(--radius);
}
.site-header .cta-tel:hover{ background:#0f2338; }

main{ flex:1; min-width:0; max-width:calc(var(--maxw) + 80px); margin:0 auto; padding:44px 24px 64px; }

.hero{ padding:6px 0 34px; }
.hero h1{ font-size:clamp(1.7rem,4vw,2.4rem); padding-left:18px; border-left:4px solid var(--accent); }
.hero .lead{ margin-top:16px; max-width:var(--maxw); font-size:1.02rem; color:#2c4159; }
.lead::first-letter{
  font-family:'Paperlogy','NanumBarunGothic',sans-serif; font-weight:700;
  font-size:3.4em; line-height:.8; float:left; color:var(--accent);
  padding:6px 10px 0 0;
}

section.card{
  max-width:var(--maxw); background:var(--surface); box-shadow:0 6px 22px rgba(23,50,77,.09);
  border-radius:var(--radius); padding:30px 30px 8px; margin-bottom:30px;
}
section.card h2{ font-size:1.2rem; padding-left:16px; border-left:4px solid var(--accent); margin-bottom:16px; }

/* 매거진형 2단 컬럼 본문 */
.col-text{ column-count:2; column-gap:32px; column-rule:1px solid #ece6d4; }
.col-text p{ color:#2c4159; margin-bottom:14px; break-inside:avoid; }
.col-text a{ color:var(--text); text-decoration:underline; text-decoration-color:var(--accent); text-underline-offset:3px; }
.col-text a:hover, .col-text a:focus-visible{ color:var(--accent); }

figure.content-figure{ margin:22px 0 26px; text-align:center; }
figure.content-figure img{ max-width:100%; height:auto; border-radius:var(--radius-img); border:1px solid #ece6d4; }
figure.content-figure figcaption{ margin-top:8px; font-size:.82rem; color:#6b7a8c; }

.cta-block{
  margin:8px 0 22px; padding:22px 20px; background:#FBF6E8; border:1px solid #ece6d4;
  border-radius:var(--radius); text-align:left;
}
.cta-block p{ color:#2c4159; margin-bottom:14px; }
.cta-block .cta-tel, .cta-block .cta-sms{
  display:inline-block; margin-right:14px; margin-bottom:8px;
  background:var(--text); color:#fff; font-weight:700; font-size:.92rem;
  padding:12px 22px; border-radius:var(--radius);
}
.cta-block .cta-tel:hover, .cta-block .cta-sms:hover{ background:#0f2338; }

footer.site-footer{ margin-left:var(--header-w); background:var(--text); color:rgba(255,255,255,.85); padding:38px 24px; font-size:.85rem; }
.footer-inner{ max-width:1000px; margin:0 auto; }
.footer-links{ display:flex; flex-wrap:wrap; gap:8px 16px; margin-bottom:18px; }
.footer-links a{ color:rgba(255,255,255,.78); }
.footer-links a:hover, .footer-links a:focus-visible{ color:#fff; }
.biz-info p{ margin:2px 0; color:rgba(255,255,255,.68); }
.footer-bottom{ margin-top:14px; color:rgba(255,255,255,.5); font-size:.78rem; }

@media (max-width:860px){
  .col-text{ column-count:1; }
}

@media (max-width:780px){
  .page{ flex-direction:column; }
  .site-header{ position:static; width:100%; min-height:auto; border-right:0; border-bottom:1px solid #ece6d4; padding:18px 20px; }
  .header-inner{ flex-direction:row; align-items:center; flex-wrap:wrap; gap:14px; height:auto; }
  .main-nav{ flex-direction:row; flex-wrap:wrap; gap:10px 16px; }
  .site-header .cta-tel{ margin-top:0; width:auto; padding:10px 16px; }
  main{ padding:32px 18px 48px; }
  footer.site-footer{ margin-left:0; }
}

@media (max-width:420px){
  section.card{ padding:22px 18px 6px; }
  .cta-block{ padding:18px 14px; }
}

/* FAQ */
#faq{ max-width:var(--maxw); margin:0 0 30px; }
#faq h2{ font-size:1.2rem; padding-left:16px; border-left:4px solid var(--accent); margin-bottom:16px; }
.qa-list{ display:flex; flex-direction:column; gap:10px; }
.qa-list details{
  background:var(--surface); border:1px solid #ece6d4; border-radius:var(--radius);
  padding:16px 20px; box-shadow:0 4px 14px rgba(23,50,77,.06);
}
.qa-list summary{
  cursor:pointer; font-weight:700; color:var(--text); list-style:none;
  padding-right:24px; position:relative;
}
.qa-list summary::-webkit-details-marker{ display:none; }
.qa-list summary::after{
  content:"+"; position:absolute; right:0; top:0; color:var(--accent); font-weight:700;
}
.qa-list details[open] summary::after{ content:"−"; }
.qa-list details p{ margin-top:12px; color:#2c4159; }

/* 건조 방식 비교 표 */
#dry-table p{ color:#2c4159; margin-bottom:16px; }
.table-scroll{ overflow-x:auto; -webkit-overflow-scrolling:touch; }
#dry-table table{ width:100%; border-collapse:collapse; margin-bottom:12px; }
#dry-table caption{ caption-side:top; }
#dry-table th, #dry-table td{
  border:1px solid #ece6d4; padding:12px 14px; text-align:left; vertical-align:top;
  font-size:.94rem; color:#2c4159;
}
#dry-table thead th{
  background:#FBF6E8; color:var(--text); font-weight:700;
  font-family:'Paperlogy','NanumBarunGothic',-apple-system,'Malgun Gothic',sans-serif;
}
#dry-table tbody tr:nth-child(even){ background:#FBFAF3; }
#dry-table td:first-child{ font-weight:700; color:var(--text); white-space:nowrap; }

@media (max-width:420px){
  #dry-table th, #dry-table td{ padding:10px 10px; font-size:.88rem; }
  #dry-table td:first-child{ white-space:normal; }
}
