/* =====================================================================
 * 성누가치과 공통 그리드 시스템
 * Desktop 1280 / 12col / gutter 24  ·  Tablet 8col / 20  ·  Mobile 4col / 16
 * ================================================================== */
:root{
  --sldc-content:1280px;
  --sldc-gutter:24px;
  --sldc-pad:32px;
  --sldc-section:120px;
  --sldc-title-gap:48px;
  --sldc-head-gap:22px;
  --sldc-card-gap:24px;
  --sldc-para-gap:18px;
  --sldc-readable:840px;
  --sldc-card-radius:20px;
  --sldc-card-pad:32px;
  --sldc-img-radius:16px;
  --sldc-btn-h:52px;
  --sldc-eyebrow:15px;
  --sldc-h2:44px;
  --sldc-desc:18px;
}
@media (max-width:1199px){
  :root{--sldc-gutter:20px;--sldc-pad:32px;--sldc-section:88px;--sldc-title-gap:40px;--sldc-h2:36px}
}
@media (max-width:767px){
  :root{--sldc-gutter:16px;--sldc-pad:20px;--sldc-section:64px;--sldc-title-gap:32px;
        --sldc-card-gap:16px;--sldc-card-pad:24px;--sldc-h2:30px;--sldc-desc:16px;--sldc-eyebrow:14px}
}

/* ---------- 공통 컨테이너 : 전 페이지 동일 폭 ---------- */
.sldc-shell,
.sldc-container{
  width:100%;
  max-width:calc(var(--sldc-content) + var(--sldc-pad) * 2);
  margin-inline:auto;
  padding-inline:var(--sldc-pad);
  box-sizing:border-box;
}
.sldc-bleed{width:100%;max-width:none;padding-inline:0}

/* ---------- 12 컬럼 그리드 ---------- */
.sldc-grid{
  display:grid;
  grid-template-columns:repeat(12,minmax(0,1fr));
  gap:var(--sldc-card-gap) var(--sldc-gutter);
  align-items:start;
}
.sldc-col-1{grid-column:span 1}
.sldc-col-2{grid-column:span 2}
.sldc-col-3{grid-column:span 3}
.sldc-col-4{grid-column:span 4}
.sldc-col-5{grid-column:span 5}
.sldc-col-6{grid-column:span 6}
.sldc-col-7{grid-column:span 7}
.sldc-col-8{grid-column:span 8}
.sldc-col-9{grid-column:span 9}
.sldc-col-10{grid-column:span 10}
.sldc-col-12{grid-column:span 12}
.sldc-col-8-center{grid-column:3 / span 8}
.sldc-col-10-center{grid-column:2 / span 10}

@media (max-width:1199px){
  .sldc-grid{grid-template-columns:repeat(8,minmax(0,1fr))}
  .sldc-col-3,.sldc-col-4{grid-column:span 4}
  .sldc-col-5,.sldc-col-6,.sldc-col-7,.sldc-col-8,
  .sldc-col-9,.sldc-col-10,.sldc-col-12{grid-column:span 8}
  .sldc-col-8-center,.sldc-col-10-center{grid-column:span 8}
}
@media (max-width:767px){
  .sldc-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
  .sldc-grid > *{grid-column:span 4 !important}
}

/* ---------- 세로 리듬 ---------- */
.sldc-section{padding-block:var(--sldc-section)}
.sldc-section--tight{padding-block:calc(var(--sldc-section) * .6)}
.sldc-section + .sldc-section{padding-top:0}
.sldc-sec-head{margin-bottom:var(--sldc-title-gap)}
.sldc-sec-head .sldc-eyebrow{
  display:block;margin:0 0 12px;
  font-size:var(--sldc-eyebrow);font-weight:800;letter-spacing:.12em;
  text-transform:uppercase;color:var(--sldcm-brand,#14577a);
}
.sldc-sec-head h2,.sldc-sec-head .sldc-h2{
  margin:0;font-size:var(--sldc-h2);line-height:1.25;letter-spacing:-.035em;
  font-weight:800;word-break:keep-all;color:var(--sldcm-ink,#26332f);
}
.sldc-sec-head .sldc-desc{
  margin:var(--sldc-head-gap) 0 0;
  font-size:var(--sldc-desc);line-height:1.7;word-break:keep-all;
  color:var(--sldcm-mute,#6b7a84);max-width:var(--sldc-readable);
}
.sldc-sec-head--narrow{max-width:calc(var(--sldc-content) / 12 * 8)}

/* ---------- 본문 가독 폭 ---------- */
.sldc-readable{max-width:var(--sldc-readable);margin-inline:auto}
.sldc-readable > p{margin-block:var(--sldc-para-gap)}
.sldc-readable--wide{max-width:1000px}

/* ---------- 카드 / 버튼 공통 ---------- */
.sldc-card{
  background:#fff;border:1px solid var(--sldcm-line,#e4eaee);
  border-radius:var(--sldc-card-radius);padding:var(--sldc-card-pad);
  box-sizing:border-box;
}
.sldc-card img,.sldc-figure img,.sldc-media img{border-radius:var(--sldc-img-radius)}
.sldc-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  min-height:var(--sldc-btn-h);padding:0 26px;border-radius:999px;
  font-weight:800;letter-spacing:-.02em;text-decoration:none;
}

/* ---------- 테마 / 엘리멘터 폭 통일 ---------- */
body.sldc-grid-on .sldc-shell{max-width:calc(var(--sldc-content) + var(--sldc-pad) * 2)}
body.sldc-grid-on .e-con.e-con-boxed > .e-con-inner,
body.sldc-grid-on .elementor-section.elementor-section-boxed > .elementor-container{
  max-width:var(--sldc-content);
}
body.sldc-grid-on .entry-content > .alignwide{max-width:var(--sldc-content)}
