@charset "UTF-8";
/* ============================================================
   임플란트 가격 — 디자인 시스템
   아이스 민트 · 소프트 실버 / 8pt 스케일 / 절제된 스펙 타이포
   ============================================================ */

/* ---------- 1. 토큰 ---------- */
:root{
  /* 8pt 간격 스케일 */
  --s-1:4px;  --s-2:8px;  --s-3:12px; --s-4:16px; --s-5:24px;
  --s-6:32px; --s-7:40px; --s-8:48px; --s-9:64px; --s-10:80px;
  --s-11:96px; --s-12:128px;

  /* 아이스 민트 */
  --mint-025:#f7fcfb;
  --mint-050:#eef8f6;
  --mint-100:#dff1ee;
  --mint-200:#c3e5e0;
  --mint-300:#93d0c9;
  --brand:#0b6f69;          /* 본문·CTA (AA) */
  --brand-deep:#07514d;
  --brand-bright:#12988e;   /* 그래픽 전용 */

  /* 소프트 실버 */
  --silver-025:#fbfcfd;
  --silver-050:#f4f7f8;
  --silver-100:#eaeff2;
  --silver-200:#dde4e8;
  --silver-300:#c6d0d6;

  /* 잉크 */
  --ink:#0e1b1f;
  --ink-2:#33474e;
  --ink-3:#5c7078;
  --ink-4:#88989f;

  --line:#e4ebee;
  --line-strong:#d3dde1;

  /* 라운드 */
  --r-xs:6px; --r-sm:10px; --r-md:16px; --r-lg:24px; --r-xl:34px; --r-pill:999px;

  /* 그림자 */
  --sh-1:0 1px 2px rgba(14,40,45,.05);
  --sh-2:0 1px 2px rgba(14,40,45,.05), 0 8px 20px -10px rgba(14,60,58,.18);
  --sh-3:0 1px 3px rgba(14,40,45,.06), 0 18px 40px -18px rgba(14,60,58,.26);
  --sh-4:0 2px 6px rgba(14,40,45,.07), 0 36px 70px -30px rgba(14,60,58,.32);

  /* 레이아웃 */
  --wrap:1180px;
  --wrap-narrow:772px;
  --gutter:clamp(20px,5vw,40px);
  --sec-y:clamp(80px,9.5vw,140px);

  /* 모션 */
  --ease:cubic-bezier(.22,.61,.36,1);
  --t-fast:150ms; --t:220ms; --t-slow:320ms;

  --font-sans:"Pretendard Variable",Pretendard,-apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo","Segoe UI",Roboto,"Malgun Gothic",sans-serif;
  --font-serif:"Noto Serif KR",Georgia,"Times New Roman",serif;
}

/* ---------- 2. 리셋 ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  margin:0;
  font-family:var(--font-sans);
  font-size:17px;
  line-height:1.75;
  color:var(--ink-2);
  background:var(--mint-025);
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  overflow-x:hidden;
  word-break:keep-all;
  overflow-wrap:break-word;
}
img,svg,video{max-width:100%;height:auto;display:block}
h1,h2,h3,h4,h5{
  margin:0;color:var(--ink);font-weight:800;
  letter-spacing:-.035em;line-height:1.22;
}
p{margin:0 0 1.1em}
p:last-child{margin-bottom:0}
a{color:var(--brand);text-decoration:none;transition:color var(--t-fast) var(--ease)}
a:hover{color:var(--brand-deep)}
ul,ol{margin:0 0 1.1em;padding-left:1.25em}
li{margin:.35em 0}
button{font-family:inherit}
table{border-collapse:collapse}
:focus-visible{
  outline:3px solid var(--brand-bright);
  outline-offset:3px;
  border-radius:var(--r-xs);
}
.skip-link{
  position:absolute;left:-9999px;top:0;z-index:2000;
  background:var(--brand);color:#fff;padding:12px 20px;border-radius:0 0 var(--r-sm) 0;
}
.skip-link:focus{left:0;color:#fff}
.sr-only{
  position:absolute;width:1px;height:1px;padding:0;margin:-1px;
  overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;
}

/* ---------- 3. 레이아웃 ---------- */
.wrap{width:100%;max-width:var(--wrap);margin-inline:auto;padding-inline:var(--gutter)}
.wrap-narrow{width:100%;max-width:var(--wrap-narrow);margin-inline:auto;padding-inline:var(--gutter)}
.section{padding-block:var(--sec-y)}
.section--tight{padding-block:clamp(56px,7vw,96px)}
.section--mint{background:var(--mint-050)}
.section--white{background:#fff}
.section--silver{background:var(--silver-050)}

/* ---------- 4. 절제된 스펙 타이포 ---------- */
.eyebrow{
  display:inline-flex;align-items:center;gap:8px;
  font-size:12px;font-weight:800;letter-spacing:.14em;
  color:var(--brand);text-transform:uppercase;
  margin:0 0 var(--s-4);
}
.eyebrow::before{
  content:"";width:22px;height:2px;border-radius:2px;
  background:var(--brand-bright);flex:none;
}
.sec-title{
  font-size:clamp(28px,3.4vw,44px);
  letter-spacing:-.04em;line-height:1.24;
  margin:0 0 var(--s-4);
}
.sec-lead{
  font-size:clamp(16px,1.5vw,18px);
  color:var(--ink-3);max-width:62ch;margin:0;
}
.sec-head{margin-bottom:clamp(40px,5vw,64px)}
.sec-head--center{text-align:center}
.sec-head--center .eyebrow{justify-content:center}
.sec-head--center .sec-lead{margin-inline:auto}

/* 스펙 태그 (수치·출처·기준일) */
.tag{
  display:inline-flex;align-items:center;gap:6px;
  padding:5px 11px;border-radius:var(--r-pill);
  font-size:12px;font-weight:700;letter-spacing:.01em;line-height:1.5;
  background:var(--mint-100);color:var(--brand-deep);
  border:1px solid var(--mint-200);white-space:nowrap;
}
.tag--silver{background:var(--silver-100);color:var(--ink-3);border-color:var(--silver-200)}
.tag--ghost{background:rgba(255,255,255,.8);color:var(--ink-2);border-color:var(--line)}
.tag-row{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 var(--s-5)}

/* 스펙 수치 (대형) */
.spec-num{
  font-size:clamp(26px,3vw,38px);font-weight:800;color:var(--ink);
  letter-spacing:-.04em;line-height:1.1;font-variant-numeric:tabular-nums;
}
.spec-label{
  font-size:12.5px;font-weight:700;letter-spacing:.06em;
  color:var(--ink-4);margin-top:6px;
}

/* 출처 캡션 */
.src-note{
  font-size:12.5px;line-height:1.7;color:var(--ink-4);
  margin-top:var(--s-4);
}
.src-note a{color:var(--ink-3);text-decoration:underline;text-underline-offset:2px}
.src-note a:hover{color:var(--brand)}

/* ---------- 5. 버튼 ---------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  min-height:52px;padding:14px 28px;
  border-radius:var(--r-pill);border:1px solid transparent;
  font-size:16px;font-weight:700;letter-spacing:-.01em;
  cursor:pointer;text-align:center;
  transition:transform var(--t) var(--ease),box-shadow var(--t) var(--ease),
             background-color var(--t) var(--ease),color var(--t) var(--ease),
             border-color var(--t) var(--ease);
}
.btn--primary{background:var(--brand);color:#fff;box-shadow:var(--sh-2)}
.btn--primary:hover{background:var(--brand-deep);color:#fff;transform:translateY(-2px);box-shadow:var(--sh-3)}
.btn--ghost{background:#fff;color:var(--brand-deep);border-color:var(--line-strong);box-shadow:var(--sh-1)}
.btn--ghost:hover{border-color:var(--mint-300);color:var(--brand-deep);transform:translateY(-2px);box-shadow:var(--sh-2)}
.btn--quiet{background:transparent;color:var(--ink-2);border-color:var(--line-strong);min-height:46px;padding:11px 20px;font-size:15px}
.btn--quiet:hover{background:#fff;color:var(--brand-deep)}
.btn--xl{min-height:74px;padding:20px 52px;font-size:clamp(18px,2vw,21px);font-weight:800;border-radius:var(--r-pill)}
.btn--block{width:100%}
.btn[disabled]{opacity:.5;cursor:not-allowed;transform:none!important}

.link-quiet{
  display:inline-flex;align-items:center;gap:6px;
  font-size:15px;font-weight:600;color:var(--ink-2);
  border-bottom:1px solid var(--line-strong);padding-bottom:2px;
}
.link-quiet:hover{color:var(--brand-deep);border-color:var(--brand)}

/* ---------- 6. 카드 ---------- */
.card{
  background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);
  box-shadow:var(--sh-2);
  transition:transform var(--t) var(--ease),box-shadow var(--t) var(--ease),border-color var(--t) var(--ease);
}
.card--pad{padding:clamp(24px,3vw,36px)}
a.card:hover,.card--hover:hover{transform:translateY(-4px);box-shadow:var(--sh-3);border-color:var(--mint-200)}
.card-media{
  position:relative;aspect-ratio:16/9;overflow:hidden;
  border-radius:var(--r-lg) var(--r-lg) 0 0;background:var(--silver-100);
}
.card-media img{width:100%;height:100%;object-fit:cover;transition:transform 520ms var(--ease)}
a.card:hover .card-media img{transform:scale(1.04)}

/* ---------- 7. 헤더 ---------- */
.site-header{
  position:sticky;top:0;z-index:900;
  background:rgba(247,252,251,.86);
  -webkit-backdrop-filter:saturate(160%) blur(14px);
  backdrop-filter:saturate(160%) blur(14px);
  border-bottom:1px solid transparent;
  transition:border-color var(--t) var(--ease),background-color var(--t) var(--ease),box-shadow var(--t) var(--ease);
}
.site-header.is-stuck{border-bottom-color:var(--line);box-shadow:0 1px 0 rgba(14,40,45,.02),0 10px 30px -22px rgba(14,60,58,.4)}
.header-inner{display:flex;align-items:center;gap:var(--s-5);min-height:76px}
.brand{display:inline-flex;align-items:center;gap:11px;flex:none}
.brand svg{width:34px;height:34px;flex:none}
.brand-name{font-size:18px;font-weight:800;color:var(--ink);letter-spacing:-.04em;line-height:1.2}
.brand-sub{display:block;font-size:11px;font-weight:700;color:var(--ink-4);letter-spacing:.09em;margin-top:1px}
.nav{margin-left:auto;display:flex;align-items:center;gap:var(--s-1)}
.nav a{
  padding:10px 15px;border-radius:var(--r-sm);
  font-size:15.5px;font-weight:600;color:var(--ink-2);
  transition:background-color var(--t-fast) var(--ease),color var(--t-fast) var(--ease);
}
.nav a:hover,.nav a[aria-current="page"]{background:var(--mint-100);color:var(--brand-deep)}
.header-cta{margin-left:var(--s-3);flex:none}
/* 내비 링크 규칙이 버튼 색을 덮지 않도록 */
.nav a.btn--primary{background:var(--brand);color:#fff;padding:12px 24px}
.nav a.btn--primary:hover{background:var(--brand-deep);color:#fff}
.nav-toggle{
  display:none;margin-left:auto;width:48px;height:48px;flex:none;
  align-items:center;justify-content:center;
  background:#fff;border:1px solid var(--line-strong);border-radius:var(--r-sm);
  cursor:pointer;color:var(--ink);
}
.nav-toggle span{display:block;width:19px;height:2px;background:currentColor;border-radius:2px;position:relative}
.nav-toggle span::before,.nav-toggle span::after{
  content:"";position:absolute;left:0;width:19px;height:2px;background:currentColor;border-radius:2px;
  transition:transform var(--t) var(--ease),top var(--t) var(--ease)
}
.nav-toggle span::before{top:-6px}
.nav-toggle span::after{top:6px}
.nav-toggle[aria-expanded="true"] span{background:transparent}
.nav-toggle[aria-expanded="true"] span::before{top:0;transform:rotate(45deg)}
.nav-toggle[aria-expanded="true"] span::after{top:0;transform:rotate(-45deg)}

@media (max-width:960px){
  .nav-toggle{display:inline-flex}
  .nav{
    position:absolute;left:0;right:0;top:100%;
    flex-direction:column;align-items:stretch;gap:2px;
    background:#fff;border-bottom:1px solid var(--line);
    padding:var(--s-3) var(--gutter) var(--s-5);
    box-shadow:var(--sh-3);
    display:none;
  }
  .nav.is-open{display:flex}
  .nav a{padding:14px 12px;font-size:16px;min-height:48px;display:flex;align-items:center}
  .header-cta{display:none}
  .nav .header-cta{display:flex;margin:var(--s-3) 0 0}
}

/* ---------- 8. 히어로 (예약 버튼 중심 · 저속 패럴랙스) ---------- */
.hero{position:relative;overflow:hidden;background:var(--mint-050);isolation:isolate}
.hero-bg{position:absolute;inset:-12% 0 -12%;z-index:0;will-change:transform}
.hero-bg img{width:100%;height:100%;object-fit:cover;object-position:center 42%}
.hero-pattern{
  position:absolute;inset:-20% -10%;z-index:1;pointer-events:none;will-change:transform;
  background-image:
    radial-gradient(circle at 1px 1px,rgba(11,111,105,.16) 1px,transparent 0);
  background-size:34px 34px;
  opacity:.5;
  -webkit-mask-image:radial-gradient(75% 60% at 50% 45%,#000 30%,transparent 78%);
  mask-image:radial-gradient(75% 60% at 50% 45%,#000 30%,transparent 78%);
}
.hero-veil{
  position:absolute;inset:0;z-index:2;
  background:
    linear-gradient(180deg,rgba(247,252,251,.92) 0%,rgba(240,250,248,.80) 34%,rgba(238,248,246,.90) 72%,var(--mint-025) 100%),
    radial-gradient(120% 80% at 50% 40%,rgba(255,255,255,.72),rgba(255,255,255,0) 62%);
}
.hero-inner{
  position:relative;z-index:3;text-align:center;
  padding-block:clamp(96px,14vw,190px);
  display:flex;flex-direction:column;align-items:center;
}
.hero-tags{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-bottom:var(--s-6)}
.hero h1{
  font-size:clamp(42px,7.2vw,80px);
  letter-spacing:-.055em;line-height:1.08;
  margin:0 0 var(--s-5);
}
.hero-trust{
  font-size:clamp(16px,1.8vw,19px);line-height:1.7;color:var(--ink-2);
  max-width:30ch;margin:0 auto var(--s-8);font-weight:500;
}
.hero-cta-ring{position:relative;display:inline-flex;margin-bottom:var(--s-6)}
.hero-cta-ring::after{
  content:"";position:absolute;inset:-10px;border-radius:var(--r-pill);
  border:1px solid var(--mint-200);pointer-events:none;
  animation:ringPulse 3.6s var(--ease) infinite;
}
@keyframes ringPulse{
  0%,100%{transform:scale(1);opacity:.85}
  50%{transform:scale(1.035);opacity:.35}
}
.hero-links{display:flex;flex-wrap:wrap;gap:var(--s-5);justify-content:center}
.hero-scroll{
  margin-top:clamp(48px,7vw,88px);
  font-size:12px;font-weight:700;letter-spacing:.16em;color:var(--ink-4);
  display:inline-flex;flex-direction:column;align-items:center;gap:10px;
}
.hero-scroll::after{
  content:"";width:1px;height:34px;
  background:linear-gradient(180deg,var(--line-strong),transparent);
}

/* ---------- 9. 데이터 스트립 ---------- */
.stat-strip{
  display:grid;grid-template-columns:repeat(4,1fr);
  background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);
  box-shadow:var(--sh-3);overflow:hidden;
}
.stat-strip > div{padding:clamp(22px,2.6vw,32px);border-left:1px solid var(--line)}
.stat-strip > div:first-child{border-left:0}
@media (max-width:820px){
  .stat-strip{grid-template-columns:repeat(2,1fr)}
  .stat-strip > div:nth-child(odd){border-left:0}
  .stat-strip > div:nth-child(n+3){border-top:1px solid var(--line)}
}

/* ---------- 10. 캐러셀 ---------- */
.carousel{position:relative}
.carousel-track{
  display:grid;grid-auto-flow:column;grid-auto-columns:minmax(300px,1fr);
  gap:var(--s-5);
  overflow-x:auto;scroll-snap-type:x mandatory;
  padding-bottom:var(--s-3);
  scrollbar-width:thin;scrollbar-color:var(--silver-300) transparent;
  -webkit-overflow-scrolling:touch;
}
.carousel-track::-webkit-scrollbar{height:6px}
.carousel-track::-webkit-scrollbar-thumb{background:var(--silver-300);border-radius:var(--r-pill)}
.carousel-track > *{scroll-snap-align:start}
@media (min-width:961px){
  .carousel-track{grid-auto-flow:row;grid-template-columns:repeat(3,1fr);overflow:visible}
}
.carousel-nav{display:flex;gap:var(--s-2);justify-content:flex-end;margin-top:var(--s-4)}
.carousel-btn{
  width:48px;height:48px;border-radius:var(--r-pill);
  background:#fff;border:1px solid var(--line-strong);color:var(--ink-2);
  display:inline-flex;align-items:center;justify-content:center;cursor:pointer;
  transition:background-color var(--t) var(--ease),color var(--t) var(--ease),border-color var(--t) var(--ease);
}
.carousel-btn:hover{background:var(--brand);color:#fff;border-color:var(--brand)}
@media (min-width:961px){.carousel-nav{display:none}}

.feature-card-body{padding:clamp(22px,2.6vw,30px)}
.feature-card-body h3{font-size:20px;margin:0 0 10px;letter-spacing:-.035em}
.feature-card-body p{font-size:15px;color:var(--ink-3);line-height:1.7;margin:0}

/* ---------- 11. 아코디언 진료목록 ---------- */
.accordion-sec{position:relative;overflow:hidden;background:var(--silver-050)}
.accordion-bg{position:absolute;inset:0;z-index:0}
.accordion-bg img{width:100%;height:100%;object-fit:cover;opacity:.22}
.accordion-bg::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(105deg,var(--silver-050) 0%,rgba(244,247,248,.94) 46%,rgba(244,247,248,.72) 100%);
}
.accordion-sec > .wrap{position:relative;z-index:1}
.accordion{
  background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);
  box-shadow:var(--sh-3);overflow:hidden;
}
.acc-item{border-top:1px solid var(--line)}
.acc-item:first-child{border-top:0}
.acc-trigger{
  width:100%;display:flex;align-items:flex-start;gap:var(--s-4);
  padding:clamp(20px,2.4vw,28px) clamp(20px,2.6vw,32px);
  background:transparent;border:0;cursor:pointer;text-align:left;
  transition:background-color var(--t) var(--ease);
}
.acc-trigger:hover{background:var(--mint-025)}
.acc-item.is-open .acc-trigger{background:var(--mint-050)}
.acc-idx{
  flex:none;font-size:12px;font-weight:800;letter-spacing:.06em;
  color:var(--brand);padding-top:6px;min-width:28px;font-variant-numeric:tabular-nums;
}
.acc-head{flex:1;min-width:0}
.acc-head h3{font-size:clamp(17px,1.8vw,20px);margin:0;letter-spacing:-.035em;line-height:1.4}
.acc-head .acc-sub{font-size:14px;color:var(--ink-3);margin:6px 0 0;line-height:1.6}
.acc-mark{
  flex:none;width:34px;height:34px;border-radius:var(--r-pill);
  background:var(--mint-100);color:var(--brand-deep);
  display:inline-flex;align-items:center;justify-content:center;
  transition:transform var(--t-slow) var(--ease),background-color var(--t) var(--ease);
  margin-top:2px;
}
.acc-item.is-open .acc-mark{transform:rotate(180deg);background:var(--brand);color:#fff}
.acc-panel{display:grid;grid-template-rows:0fr;transition:grid-template-rows var(--t-slow) var(--ease)}
.acc-item.is-open .acc-panel{grid-template-rows:1fr}
.acc-panel > div{overflow:hidden}
.acc-body{padding:0 clamp(20px,2.6vw,32px) clamp(24px,3vw,32px) clamp(52px,6vw,76px)}
.acc-body p{font-size:15.5px;line-height:1.78;color:var(--ink-2)}
.acc-body ul{margin:0 0 1em;padding-left:1.15em}
.acc-body li{font-size:15px;color:var(--ink-2);line-height:1.7}
.acc-spec{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));
  gap:var(--s-2);margin:var(--s-4) 0 var(--s-4);
  padding:var(--s-4);background:var(--silver-050);
  border:1px solid var(--line);border-radius:var(--r-md);
}
.acc-spec dt{font-size:11.5px;font-weight:800;letter-spacing:.06em;color:var(--ink-4);margin:0}
.acc-spec dd{margin:3px 0 0;font-size:15px;font-weight:700;color:var(--ink);font-variant-numeric:tabular-nums}

/* ---------- 12. 진료철학 인용블록 (편집 원칙) ---------- */
.philo-grid{display:grid;grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);gap:clamp(32px,5vw,72px);align-items:center}
@media (max-width:900px){.philo-grid{grid-template-columns:1fr}}
.philo-media{
  position:relative;border-radius:var(--r-xl);overflow:hidden;
  aspect-ratio:4/5;box-shadow:var(--sh-4);background:var(--silver-100);
}
.philo-media img{width:100%;height:100%;object-fit:cover}
.philo-media::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(190deg,rgba(11,111,105,0) 42%,rgba(7,81,77,.30) 100%);
}
.quote-list{display:flex;flex-direction:column;gap:var(--s-5)}
.quote-block{
  position:relative;background:#fff;border:1px solid var(--line);
  border-left:3px solid var(--brand-bright);
  border-radius:0 var(--r-md) var(--r-md) 0;
  padding:clamp(22px,2.8vw,30px) clamp(24px,3vw,34px);
  box-shadow:var(--sh-2);
}
.quote-block q{
  display:block;font-family:var(--font-serif);
  font-size:clamp(17px,1.9vw,20px);line-height:1.78;color:var(--ink);
  font-weight:500;quotes:"“" "”";
}
.quote-sign{
  display:flex;align-items:baseline;gap:10px;margin-top:var(--s-4);
  padding-top:var(--s-4);border-top:1px dashed var(--line-strong);
}
.quote-sign strong{
  font-family:var(--font-serif);font-size:17px;font-weight:600;
  color:var(--brand-deep);letter-spacing:.02em;
}
.quote-sign span{font-size:12.5px;color:var(--ink-4);font-weight:600}

/* ---------- 13. 협진 네트워크 맵 ---------- */
.network-sec{position:relative;overflow:hidden;background:var(--mint-050)}
.network-bg{position:absolute;inset:0;z-index:0}
.network-bg img{width:100%;height:100%;object-fit:cover;opacity:.5}
.network-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(238,248,246,.86),rgba(247,252,251,.94))}
.network-sec > .wrap{position:relative;z-index:1}
.network-figure{
  max-width:660px;margin-inline:auto;
  background:rgba(255,255,255,.7);
  -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);
  border:1px solid var(--line);border-radius:var(--r-xl);
  padding:clamp(20px,3vw,36px);box-shadow:var(--sh-3);
}
.network-figure svg{width:100%;height:auto;display:block}
.net-line{stroke:var(--mint-300);stroke-width:1.4;fill:none;stroke-dasharray:4 5}
.net-node circle{fill:#fff;stroke:var(--mint-200);stroke-width:1.4;transition:stroke var(--t) var(--ease),fill var(--t) var(--ease)}
.net-node text{
  font-family:var(--font-sans);font-size:11px;font-weight:800;
  fill:var(--brand-deep);text-anchor:middle;dominant-baseline:middle;letter-spacing:-.02em;
}
.net-node:hover circle,.net-node:focus-visible circle{fill:var(--mint-050);stroke:var(--brand-bright)}
.net-hub circle{fill:var(--brand);stroke:var(--brand-deep)}
.net-hub text{fill:#fff;font-size:12.5px}
.net-caption{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
  gap:var(--s-3);margin-top:var(--s-6);
}
.net-caption div{
  background:#fff;border:1px solid var(--line);border-radius:var(--r-sm);
  padding:14px 16px;
}
.net-caption dt{font-size:11.5px;font-weight:800;letter-spacing:.06em;color:var(--brand);margin:0 0 4px}
.net-caption dd{margin:0;font-size:13.5px;line-height:1.6;color:var(--ink-3)}

/* ---------- 14. 장비 확대 뷰어 갤러리 ---------- */
.viewer-grid{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:var(--s-5)}
@media (max-width:900px){.viewer-grid{grid-template-columns:1fr}}
.viewer-main{
  position:relative;border-radius:var(--r-lg);overflow:hidden;
  aspect-ratio:3/2;box-shadow:var(--sh-3);border:1px solid var(--line);
  cursor:zoom-in;background:var(--silver-100);
}
.viewer-main img{width:100%;height:100%;object-fit:cover;transition:transform 400ms var(--ease)}
.viewer-lens{
  position:absolute;border:2px solid rgba(255,255,255,.9);
  border-radius:var(--r-pill);pointer-events:none;
  box-shadow:0 0 0 9999px rgba(7,40,38,.28),var(--sh-3);
  background-repeat:no-repeat;opacity:0;
  transition:opacity var(--t) var(--ease);
}
.viewer-main.is-zoom .viewer-lens{opacity:1}
.viewer-hint{
  position:absolute;left:16px;bottom:16px;z-index:2;
  display:inline-flex;align-items:center;gap:8px;
  padding:9px 15px;border-radius:var(--r-pill);
  background:rgba(255,255,255,.94);border:1px solid var(--line);
  font-size:12.5px;font-weight:700;color:var(--ink-2);
  box-shadow:var(--sh-2);transition:opacity var(--t) var(--ease);
}
.viewer-main.is-zoom .viewer-hint{opacity:0}
.viewer-side{display:grid;gap:var(--s-5);align-content:start}
.viewer-thumb{
  position:relative;border-radius:var(--r-md);overflow:hidden;
  aspect-ratio:3/2;border:1px solid var(--line);box-shadow:var(--sh-1);background:var(--silver-100);
}
.viewer-thumb img{width:100%;height:100%;object-fit:cover}
.viewer-note{
  background:#fff;border:1px solid var(--line);border-radius:var(--r-md);
  padding:var(--s-5);box-shadow:var(--sh-1);
}
.viewer-note h3{font-size:16px;margin:0 0 8px}
.viewer-note p{font-size:14px;color:var(--ink-3);line-height:1.7;margin:0}

/* ---------- 15. CTA 패널 ---------- */
.cta-panel{
  position:relative;overflow:hidden;
  background:linear-gradient(135deg,var(--brand-deep) 0%,var(--brand) 58%,#0d7d75 100%);
  border-radius:var(--r-xl);
  padding:clamp(40px,6vw,76px) clamp(28px,5vw,68px);
  text-align:center;box-shadow:var(--sh-4);
}
.cta-panel::before{
  content:"";position:absolute;inset:0;pointer-events:none;
  background-image:radial-gradient(circle at 1px 1px,rgba(255,255,255,.14) 1px,transparent 0);
  background-size:26px 26px;
  -webkit-mask-image:radial-gradient(80% 70% at 50% 0%,#000,transparent 75%);
  mask-image:radial-gradient(80% 70% at 50% 0%,#000,transparent 75%);
}
.cta-panel > *{position:relative}
.cta-panel h2{color:#fff;font-size:clamp(26px,3.4vw,42px);letter-spacing:-.04em;margin:0 0 var(--s-4)}
.cta-panel p{color:rgba(255,255,255,.85);font-size:clamp(15px,1.6vw,17.5px);max-width:56ch;margin:0 auto var(--s-7)}
.cta-panel .tag{background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.24);color:#fff}
.cta-panel .btn--primary{background:#fff;color:var(--brand-deep)}
.cta-panel .btn--primary:hover{background:var(--mint-050);color:var(--brand-deep)}
.cta-panel .btn--ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.4)}
.cta-panel .btn--ghost:hover{background:rgba(255,255,255,.1);color:#fff;border-color:rgba(255,255,255,.7)}
.cta-actions{display:flex;flex-wrap:wrap;gap:var(--s-4);justify-content:center}

/* ---------- 16. 지역 지도 ---------- */
.map-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:clamp(32px,5vw,64px);align-items:center}
@media (max-width:900px){.map-grid{grid-template-columns:1fr}}
.map-photo{border-radius:var(--r-xl);overflow:hidden;aspect-ratio:16/10;box-shadow:var(--sh-3);border:1px solid var(--line);background:var(--silver-100)}
.map-photo img{width:100%;height:100%;object-fit:cover}
.region-chips{display:flex;flex-wrap:wrap;gap:var(--s-2);margin:var(--s-5) 0 0}
.region-chip{
  display:inline-flex;align-items:center;gap:7px;
  min-height:44px;padding:10px 16px;border-radius:var(--r-pill);
  background:#fff;border:1px solid var(--line-strong);
  font-size:14.5px;font-weight:700;color:var(--ink-2);
  transition:background-color var(--t) var(--ease),color var(--t) var(--ease),border-color var(--t) var(--ease),transform var(--t) var(--ease);
}
.region-chip b{font-size:12.5px;font-weight:800;color:var(--brand);font-variant-numeric:tabular-nums}
.region-chip:hover{background:var(--brand);border-color:var(--brand);color:#fff;transform:translateY(-2px)}
.region-chip:hover b{color:rgba(255,255,255,.85)}

/* ---------- 17. 생활습관 인포열 ---------- */
.habit-grid{display:grid;grid-template-columns:minmax(0,.72fr) minmax(0,1.28fr);gap:clamp(32px,5vw,72px);align-items:start}
@media (max-width:900px){.habit-grid{grid-template-columns:1fr}}
.habit-media{border-radius:var(--r-xl);overflow:hidden;aspect-ratio:4/5;box-shadow:var(--sh-3);border:1px solid var(--line);background:var(--silver-100);position:sticky;top:100px}
@media (max-width:900px){.habit-media{position:static;aspect-ratio:16/10}}
.habit-media img{width:100%;height:100%;object-fit:cover}
.habit-col{position:relative;padding-left:var(--s-7)}
.habit-col::before{
  content:"";position:absolute;left:23px;top:14px;bottom:14px;width:1px;
  background:linear-gradient(180deg,transparent,var(--mint-200) 12%,var(--mint-200) 88%,transparent);
}
.habit-item{position:relative;padding:0 0 var(--s-7) var(--s-6)}
.habit-item:last-child{padding-bottom:0}
.habit-icon{
  position:absolute;left:-25px;top:0;width:48px;height:48px;flex:none;
  border-radius:var(--r-pill);background:#fff;border:1px solid var(--mint-200);
  display:inline-flex;align-items:center;justify-content:center;
  color:var(--brand);box-shadow:var(--sh-1);
}
.habit-icon svg{width:22px;height:22px}
.habit-item h3{font-size:17.5px;margin:10px 0 6px;letter-spacing:-.035em}
.habit-item p{font-size:15px;color:var(--ink-3);line-height:1.75;margin:0}
.habit-item .tag{margin-top:10px}

/* ---------- 18. 글 카드 그리드 ---------- */
.post-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:var(--s-5)}
.post-card{display:flex;flex-direction:column;overflow:hidden}
.post-card .card-media{aspect-ratio:16/10}
.post-card-body{padding:var(--s-5);display:flex;flex-direction:column;flex:1}
.post-card-body h3{font-size:18px;line-height:1.45;margin:0 0 10px;letter-spacing:-.035em;color:var(--ink)}
.post-card-body p{font-size:14.5px;color:var(--ink-3);line-height:1.7;margin:0 0 var(--s-4);
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.post-card-meta{margin-top:auto;display:flex;align-items:center;gap:10px;font-size:12.5px;color:var(--ink-4);font-weight:600}

/* ---------- 19. 플로팅 액션 ---------- */
.fab{
  position:fixed;right:20px;bottom:20px;z-index:800;
  display:flex;flex-direction:column;gap:10px;align-items:flex-end;
}
.fab a{
  display:inline-flex;align-items:center;gap:10px;
  min-height:52px;padding:13px 22px 13px 18px;border-radius:var(--r-pill);
  font-size:15px;font-weight:700;box-shadow:var(--sh-3);
  transition:transform var(--t) var(--ease),box-shadow var(--t) var(--ease);
}
.fab a:hover{transform:translateY(-2px);box-shadow:var(--sh-4)}
.fab svg{width:20px;height:20px;flex:none}
.fab-primary{background:var(--brand);color:#fff}
.fab-primary:hover{color:#fff}
.fab-second{background:#fff;color:var(--brand-deep);border:1px solid var(--line-strong)}
@media (max-width:600px){
  .fab{right:14px;bottom:14px;gap:8px}
  .fab a{padding:12px 18px 12px 15px;font-size:14px;min-height:48px}
  .fab-second span{display:none}
  .fab-second{padding:12px;border-radius:var(--r-pill)}
}

/* ---------- 20. 푸터 ---------- */
.site-footer{background:#0c1c1f;color:#9fb3b8;padding-block:clamp(56px,7vw,88px) var(--s-8);font-size:14.5px}
.footer-top{display:grid;grid-template-columns:minmax(0,1.5fr) repeat(3,minmax(0,1fr));gap:var(--s-7)}
@media (max-width:900px){.footer-top{grid-template-columns:repeat(2,1fr);gap:var(--s-6)}}
@media (max-width:520px){.footer-top{grid-template-columns:1fr}}
.footer-brand svg{width:36px;height:36px;margin-bottom:var(--s-3)}
.footer-brand strong{display:block;color:#fff;font-size:17px;font-weight:800;letter-spacing:-.03em;margin-bottom:10px}
.footer-brand p{font-size:14px;line-height:1.8;color:#8ba3a8;max-width:36ch;margin:0}
.footer-col h4{color:#e2edee;font-size:13px;font-weight:800;letter-spacing:.09em;margin:0 0 var(--s-4)}
.footer-col ul{list-style:none;margin:0;padding:0}
.footer-col li{margin:0 0 11px}
.footer-col a{color:#9fb3b8;font-size:14.5px}
.footer-col a:hover{color:#fff}
.footer-legal{
  margin-top:clamp(40px,5vw,64px);padding-top:var(--s-6);
  border-top:1px solid rgba(255,255,255,.09);
}
.footer-legal .legal-notice{
  background:rgba(255,255,255,.035)!important;
  border-left:3px solid rgba(147,208,201,.5)!important;
  color:#8ba3a8!important;border-radius:0 var(--r-sm) var(--r-sm) 0!important;
  padding:16px 20px!important;margin:0 0 var(--s-5)!important;
  font-size:.82em!important;line-height:1.8;
}
.footer-legal .legal-notice p{margin:5px 0!important}
.footer-meta{display:flex;flex-wrap:wrap;gap:var(--s-2) var(--s-5);align-items:center;font-size:13px;color:#7b9298}
.footer-meta a{color:#9fb3b8}
.footer-meta a:hover{color:#fff}

/* ---------- 21. 스크롤 등장 ---------- */
[data-reveal]{opacity:0;transform:translateY(22px);transition:opacity 620ms var(--ease),transform 620ms var(--ease)}
[data-reveal].is-in{opacity:1;transform:none}
[data-reveal-delay="1"]{transition-delay:80ms}
[data-reveal-delay="2"]{transition-delay:160ms}
[data-reveal-delay="3"]{transition-delay:240ms}
[data-reveal-delay="4"]{transition-delay:320ms}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.01ms!important;animation-iteration-count:1!important;
    transition-duration:.01ms!important;scroll-behavior:auto!important;
  }
  [data-reveal]{opacity:1!important;transform:none!important}
  .hero-bg,.hero-pattern{transform:none!important}
}

/* ---------- 22. 표 ---------- */
.table-wrap{
  overflow-x:auto;-webkit-overflow-scrolling:touch;
  border:1px solid var(--line);border-radius:var(--r-md);background:#fff;box-shadow:var(--sh-1);
}
.data-table{width:100%;min-width:600px;font-size:14.5px}
.data-table caption{
  caption-side:top;text-align:left;padding:16px 20px 0;
  font-size:13px;font-weight:700;color:var(--ink-4);letter-spacing:.02em;
}
.data-table th,.data-table td{padding:13px 18px;text-align:left;border-bottom:1px solid var(--line)}
.data-table thead th{
  background:var(--silver-050);font-size:12.5px;font-weight:800;
  letter-spacing:.04em;color:var(--ink-3);white-space:nowrap;
  position:sticky;top:0;z-index:1;
}
.data-table tbody tr:last-child td{border-bottom:0}
.data-table tbody tr:hover{background:var(--mint-025)}
.data-table .num{text-align:right;font-variant-numeric:tabular-nums;font-weight:700;color:var(--ink);white-space:nowrap}
.data-table .rank{color:var(--ink-4);font-weight:800;font-size:12.5px;width:44px}

/* 막대 */
.bar{position:relative;height:8px;border-radius:var(--r-pill);background:var(--silver-100);overflow:hidden;min-width:80px}
.bar > span{position:absolute;inset:0 auto 0 0;border-radius:var(--r-pill);background:linear-gradient(90deg,var(--brand-bright),var(--brand))}

/* ---------- 23. 폼 ---------- */
.field{margin-bottom:var(--s-5)}
.field > label{display:block;font-size:14px;font-weight:700;color:var(--ink);margin-bottom:9px}
.field .req{color:#b4342b;margin-left:3px}
.field .hint{font-size:12.5px;color:var(--ink-4);margin-top:7px;line-height:1.6}
.input,.select,.textarea{
  width:100%;min-height:52px;padding:14px 16px;
  font-family:inherit;font-size:16px;color:var(--ink);
  background:#fff;border:1px solid var(--line-strong);border-radius:var(--r-sm);
  transition:border-color var(--t) var(--ease),box-shadow var(--t) var(--ease);
  appearance:none;
}
.textarea{min-height:132px;line-height:1.7;resize:vertical}
.select{
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235c7078' stroke-width='2.2' stroke-linecap='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 14px center;background-size:19px;
  padding-right:44px;cursor:pointer;
}
.input:focus,.select:focus,.textarea:focus{
  outline:none;border-color:var(--brand-bright);
  box-shadow:0 0 0 4px rgba(18,152,142,.13);
}
.input::placeholder,.textarea::placeholder{color:var(--ink-4)}
.check{display:flex;gap:11px;align-items:flex-start;font-size:14.5px;line-height:1.7;color:var(--ink-2);cursor:pointer}
.check input{
  width:22px;height:22px;flex:none;margin:2px 0 0;accent-color:var(--brand);cursor:pointer;
}
.consent-box{
  background:var(--silver-050);border:1px solid var(--line);border-radius:var(--r-md);
  padding:var(--s-5);margin-bottom:var(--s-5);
}
.consent-box .consent-text{
  font-size:13px;line-height:1.8;color:var(--ink-3);
  max-height:132px;overflow-y:auto;padding:14px 16px;background:#fff;
  border:1px solid var(--line);border-radius:var(--r-sm);margin-bottom:var(--s-4);
}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 var(--s-5)}
@media (max-width:640px){.form-grid{grid-template-columns:1fr}}
.alert{
  padding:15px 18px;border-radius:var(--r-sm);font-size:14.5px;line-height:1.7;
  margin-bottom:var(--s-5);border:1px solid;
}
.alert--ok{background:var(--mint-050);border-color:var(--mint-200);color:var(--brand-deep)}
.alert--err{background:#fdf3f2;border-color:#f3d2ce;color:#8f2b22}

/* 상담요약 패널 */
.summary-panel{
  background:var(--mint-025);border:1px solid var(--mint-200);border-radius:var(--r-lg);
  padding:clamp(22px,3vw,30px);box-shadow:var(--sh-2);
}
.summary-panel h3{font-size:17px;margin:0 0 4px}
.summary-panel > p{font-size:13.5px;color:var(--ink-3);margin:0 0 var(--s-5)}
.summary-list{list-style:none;margin:0 0 var(--s-5);padding:0;border-top:1px solid var(--mint-200)}
.summary-list li{
  display:flex;align-items:baseline;gap:var(--s-4);margin:0;
  padding:13px 2px;border-bottom:1px solid var(--mint-200);font-size:15px;
}
.summary-list dt,.summary-list .k{
  flex:none;width:96px;font-size:12.5px;font-weight:800;letter-spacing:.04em;color:var(--ink-4);
}
.summary-list .v{flex:1;min-width:0;font-weight:700;color:var(--ink);word-break:break-all}
.summary-list .v.is-empty{font-weight:500;color:var(--ink-4)}
.summary-list .edit{
  flex:none;font-size:12.5px;font-weight:700;color:var(--brand);
  background:none;border:0;cursor:pointer;padding:6px 8px;border-radius:var(--r-xs);
  min-height:auto;
}
.summary-list .edit:hover{background:var(--mint-100)}

/* ---------- 24. 검색 UI ---------- */
.finder{
  background:#fff;border:1px solid var(--line);border-radius:var(--r-xl);
  box-shadow:var(--sh-3);padding:clamp(24px,3.4vw,40px);
}
.finder-controls{display:grid;grid-template-columns:repeat(3,1fr) auto;gap:var(--s-4);align-items:end}
@media (max-width:860px){.finder-controls{grid-template-columns:1fr 1fr}
  .finder-controls > *:nth-child(3){grid-column:1/-1}
  .finder-controls > *:last-child{grid-column:1/-1}}
@media (max-width:520px){.finder-controls{grid-template-columns:1fr}
  .finder-controls > *{grid-column:1/-1!important}}
.finder-controls .field{margin:0}
.finder-meta{
  display:flex;flex-wrap:wrap;gap:var(--s-3);align-items:center;justify-content:space-between;
  margin:var(--s-6) 0 var(--s-4);padding-top:var(--s-5);border-top:1px solid var(--line);
}
.finder-count{font-size:14.5px;color:var(--ink-3)}
.finder-count b{color:var(--ink);font-weight:800;font-variant-numeric:tabular-nums}
.hosp-list{list-style:none;margin:0;padding:0;display:grid;gap:var(--s-3)}
.hosp-item{
  border:1px solid var(--line);border-radius:var(--r-md);background:#fff;
  transition:border-color var(--t) var(--ease),box-shadow var(--t) var(--ease);
}
.hosp-item:hover{border-color:var(--mint-300);box-shadow:var(--sh-2)}
.hosp-head{
  width:100%;display:flex;align-items:flex-start;gap:var(--s-4);
  padding:var(--s-5);background:none;border:0;cursor:pointer;text-align:left;
}
.hosp-title{flex:1;min-width:0}
.hosp-title h3{font-size:17px;margin:0 0 6px;letter-spacing:-.03em;line-height:1.4}
.hosp-addr{font-size:14px;color:var(--ink-3);margin:0;line-height:1.6}
.hosp-tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.hosp-open{
  flex:none;width:36px;height:36px;border-radius:var(--r-pill);
  background:var(--silver-050);color:var(--ink-3);
  display:inline-flex;align-items:center;justify-content:center;
  transition:transform var(--t-slow) var(--ease),background-color var(--t) var(--ease),color var(--t) var(--ease);
}
.hosp-item.is-open .hosp-open{transform:rotate(180deg);background:var(--brand);color:#fff}
.hosp-detail{display:grid;grid-template-rows:0fr;transition:grid-template-rows var(--t-slow) var(--ease)}
.hosp-item.is-open .hosp-detail{grid-template-rows:1fr}
.hosp-detail > div{overflow:hidden}
.hosp-detail-in{padding:0 var(--s-5) var(--s-5);border-top:1px solid var(--line);margin-top:0;padding-top:var(--s-5)}
.hours-table{width:100%;font-size:14px;border:1px solid var(--line);border-radius:var(--r-sm);overflow:hidden}
.hours-table th,.hours-table td{padding:9px 13px;border-bottom:1px solid var(--line);text-align:left}
.hours-table th{background:var(--silver-050);font-size:12.5px;font-weight:800;color:var(--ink-3);width:96px}
.hours-table tr:last-child th,.hours-table tr:last-child td{border-bottom:0}
.hours-table td{font-variant-numeric:tabular-nums;color:var(--ink-2)}
.hours-table .off{color:var(--ink-4)}
.spinner{
  display:inline-block;width:20px;height:20px;border-radius:50%;
  border:2.5px solid var(--mint-200);border-top-color:var(--brand);
  animation:spin .7s linear infinite;vertical-align:-4px;
}
@keyframes spin{to{transform:rotate(360deg)}}
.state-msg{padding:var(--s-8) var(--s-5);text-align:center;color:var(--ink-3);font-size:15px}

/* ---------- 25. 유틸 ---------- */
.grid-2{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:var(--s-5)}
.grid-3{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:var(--s-5)}
.stack-4{display:flex;flex-direction:column;gap:var(--s-4)}
.mt-6{margin-top:var(--s-6)}
.mt-8{margin-top:var(--s-8)}
.center{text-align:center}
.legal-notice{font-size:.85em;color:#777;background:#f8f9fa;border-left:3px solid #cbd5e1;padding:10px 14px;margin-top:2em;border-radius:0 6px 6px 0}
.legal-notice p{margin:4px 0}
.ai-notice{font-size:.85em;color:#888;margin-top:2em}

/* ============================================================
   26. 글·페이지 본문 (single / page)
   빌드 디자인 시스템을 그대로 상속한다.
   ============================================================ */
.entry-hero{
  position:relative;background:var(--mint-050);overflow:hidden;
  border-bottom:1px solid var(--line);
}
.entry-hero::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background-image:radial-gradient(circle at 1px 1px,rgba(11,111,105,.10) 1px,transparent 0);
  background-size:30px 30px;
  -webkit-mask-image:radial-gradient(70% 70% at 50% 30%,#000,transparent 75%);
  mask-image:radial-gradient(70% 70% at 50% 30%,#000,transparent 75%);
}
.entry-hero > .wrap-narrow{position:relative;z-index:1;padding-block:clamp(56px,8vw,104px) clamp(40px,5vw,64px)}
.entry-hero .breadcrumb{
  display:flex;flex-wrap:wrap;gap:8px;align-items:center;
  font-size:13px;color:var(--ink-4);margin:0 0 var(--s-5);
}
.entry-hero .breadcrumb a{color:var(--ink-3)}
.entry-hero .breadcrumb a:hover{color:var(--brand)}
.entry-hero .breadcrumb span[aria-hidden]{color:var(--silver-300)}
.entry-title{
  font-size:clamp(30px,4.4vw,52px);letter-spacing:-.045em;line-height:1.22;
  margin:0 0 var(--s-5);
}
.entry-meta{display:flex;flex-wrap:wrap;gap:10px;align-items:center;font-size:13.5px;color:var(--ink-4)}
.entry-meta time{font-variant-numeric:tabular-nums}
.entry-lead{
  font-size:clamp(16.5px,1.7vw,18.5px);line-height:1.8;color:var(--ink-2);
  margin:var(--s-5) 0 0;padding-left:var(--s-5);border-left:3px solid var(--mint-200);
}
.entry-thumb{
  max-width:var(--wrap);margin:0 auto;padding-inline:var(--gutter);
  margin-top:calc(-1 * clamp(20px,3vw,40px));position:relative;z-index:2;
}
.entry-thumb img{
  width:100%;aspect-ratio:16/9;object-fit:cover;
  border-radius:var(--r-xl);border:1px solid var(--line);box-shadow:var(--sh-4);
}

/* 본문 타이포 */
.prose{
  max-width:var(--wrap-narrow);margin-inline:auto;padding-inline:var(--gutter);
  font-size:17.5px;line-height:1.8;color:var(--ink-2);
}
.prose > *:first-child{margin-top:0}
.prose h2{
  font-size:clamp(23px,2.6vw,30px);letter-spacing:-.04em;line-height:1.35;
  margin:clamp(52px,6vw,76px) 0 var(--s-5);padding-top:var(--s-5);
  border-top:1px solid var(--line);position:relative;
}
.prose h2::before{
  content:"";position:absolute;top:-1px;left:0;width:52px;height:2px;
  background:var(--brand-bright);border-radius:2px;
}
.prose h3{font-size:clamp(18.5px,2vw,21px);letter-spacing:-.035em;margin:var(--s-8) 0 var(--s-4);color:var(--ink)}
.prose h4{font-size:17px;margin:var(--s-6) 0 var(--s-3);color:var(--ink)}
.prose p{margin:0 0 1.35em}
.prose a{text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px;font-weight:500}
.prose a:hover{text-decoration-thickness:2px}
.prose strong{font-weight:700;color:var(--ink)}
.prose ul,.prose ol{margin:0 0 1.5em;padding-left:1.3em}
.prose li{margin:.5em 0}
.prose li::marker{color:var(--brand-bright)}
.prose img{border-radius:var(--r-lg);border:1px solid var(--line);box-shadow:var(--sh-2);margin:var(--s-7) 0}
.prose figure{margin:var(--s-7) 0}
.prose figcaption{font-size:13px;color:var(--ink-4);margin-top:10px;text-align:center;line-height:1.6}
.prose blockquote{
  margin:var(--s-7) 0;padding:var(--s-5) var(--s-6);
  background:var(--mint-025);border:1px solid var(--mint-200);
  border-left:3px solid var(--brand-bright);border-radius:0 var(--r-md) var(--r-md) 0;
  font-family:var(--font-serif);font-size:17px;line-height:1.8;color:var(--ink);
}
.prose blockquote p:last-child{margin-bottom:0}
.prose hr{border:0;border-top:1px solid var(--line);margin:var(--s-9) 0}
.prose code{
  background:var(--silver-100);border:1px solid var(--line);border-radius:var(--r-xs);
  padding:2px 7px;font-size:.9em;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
}
.prose pre{overflow-x:auto;-webkit-overflow-scrolling:touch;background:var(--silver-050);
  border:1px solid var(--line);border-radius:var(--r-md);padding:var(--s-5)}
.prose table{
  width:100%;min-width:520px;font-size:15px;background:#fff;
}
.prose .table-wrap{margin:var(--s-6) 0}
.prose table th,.prose table td{padding:12px 16px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
.prose table thead th{background:var(--silver-050);font-size:12.5px;font-weight:800;letter-spacing:.04em;color:var(--ink-3)}
.prose table tbody tr:last-child td{border-bottom:0}

/* 본문 안 강조 박스 */
.prose .note-box{
  background:var(--mint-025);border:1px solid var(--mint-200);border-radius:var(--r-md);
  padding:var(--s-5) var(--s-6);margin:var(--s-6) 0;font-size:16px;
}
.prose .note-box > *:last-child{margin-bottom:0}
.prose .note-box .tag{margin-bottom:12px}
.prose .checklist{list-style:none;padding-left:0}
.prose .checklist li{
  position:relative;padding-left:32px;margin:.7em 0;
}
.prose .checklist li::before{
  content:"";position:absolute;left:0;top:.55em;width:18px;height:18px;
  border-radius:var(--r-xs);border:1.5px solid var(--mint-300);background:var(--mint-050);
}
.prose .checklist li::after{
  content:"";position:absolute;left:5.5px;top:.85em;width:7px;height:4px;
  border-left:2px solid var(--brand);border-bottom:2px solid var(--brand);
  transform:rotate(-45deg);
}
.prose .legal-notice{margin-top:var(--s-8)}
.prose .ai-notice{margin-top:var(--s-5)}

/* 목차 */
.toc{
  background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);
  padding:var(--s-5) var(--s-6);margin:0 0 var(--s-8);box-shadow:var(--sh-1);
}
.toc h2{
  font-size:13px!important;font-weight:800;letter-spacing:.1em;color:var(--brand);
  margin:0 0 var(--s-4)!important;padding:0!important;border:0!important;
}
.toc h2::before{display:none}
.toc ol{margin:0;padding-left:0;list-style:none;counter-reset:toc}
.toc li{margin:0;counter-increment:toc}
.toc a{
  display:flex;gap:12px;padding:9px 0;font-size:15px;color:var(--ink-2);
  text-decoration:none;font-weight:500;border-bottom:1px solid var(--silver-050);
  line-height:1.55;
}
.toc li:last-child a{border-bottom:0}
.toc a::before{
  content:counter(toc,decimal-leading-zero);flex:none;
  font-size:12px;font-weight:800;color:var(--ink-4);padding-top:3px;
}
.toc a:hover{color:var(--brand-deep)}
.toc a:hover::before{color:var(--brand)}

/* 글 하단 */
.entry-foot{
  max-width:var(--wrap-narrow);margin:clamp(56px,7vw,88px) auto 0;
  padding-inline:var(--gutter);
}
.entry-share{
  display:flex;flex-wrap:wrap;gap:var(--s-3);align-items:center;
  padding:var(--s-5) 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);
  font-size:14px;color:var(--ink-4);
}
.related{background:var(--silver-050);border-top:1px solid var(--line)}

/* 페이지네이션 */
.pager{display:flex;flex-wrap:wrap;gap:var(--s-2);justify-content:center;margin-top:clamp(40px,5vw,64px)}
.pager a,.pager span{
  min-width:48px;min-height:48px;padding:12px 16px;border-radius:var(--r-sm);
  display:inline-flex;align-items:center;justify-content:center;
  font-size:15px;font-weight:700;border:1px solid var(--line-strong);background:#fff;color:var(--ink-2);
  transition:background-color var(--t) var(--ease),color var(--t) var(--ease),border-color var(--t) var(--ease);
}
.pager a:hover{background:var(--mint-050);border-color:var(--mint-300);color:var(--brand-deep)}
.pager .current{background:var(--brand);border-color:var(--brand);color:#fff}

/* 아카이브 헤더 */
.archive-head{background:var(--mint-050);border-bottom:1px solid var(--line)}
.archive-head > .wrap{padding-block:clamp(56px,7vw,96px)}

/* 워드프레스 기본 요소 정리 */
.wp-caption{max-width:100%}
.alignleft{float:left;margin:0 var(--s-5) var(--s-4) 0}
.alignright{float:right;margin:0 0 var(--s-4) var(--s-5)}
.aligncenter{margin-inline:auto;display:block}
.wp-block-image{margin:var(--s-7) 0}
.screen-reader-text{
  position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;
}
@media (max-width:640px){
  .alignleft,.alignright{float:none;margin:var(--s-5) 0}
}

/* ============================================================
   27. 터치 타깃 보정 (44px 이상)
   레이아웃을 흔들지 않도록 가상요소로 히트 영역만 넓힌다.
   ============================================================ */
.link-quiet,
.footer-col a,
.footer-meta a,
.breadcrumb a,
.src-note a,
.entry-meta a{position:relative}
.link-quiet::after,
.footer-col a::after,
.footer-meta a::after,
.breadcrumb a::after,
.src-note a::after,
.entry-meta a::after{
  content:"";position:absolute;left:0;right:0;top:50%;
  transform:translateY(-50%);height:44px;
}
/* 본문 안 인라인 링크는 문단 흐름을 깨지 않도록 제외 */
.prose p .src-note a::after{content:none}

.brand{min-height:44px}
.summary-list .edit{padding:12px 14px;min-height:44px;display:inline-flex;align-items:center}
.check{min-height:44px;align-items:center;padding-block:4px}
.check input{width:24px;height:24px;margin-top:0}
.toc a{min-height:44px;align-items:center}