/* ═══════════════════════════════════════════════
   다스림한의원 — 전용 스타일시트 (02)
   콘셉트: 한지 아이보리 + 딥그린 + 골드, 분할 히어로,
   세로쓰기 악센트, 아치 곡선 — 01 치과와 완전히 다른 구도
═══════════════════════════════════════════════ */
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
:root{
  --ink:#221f18;
  --ink-soft:#6e6753;
  --green:#2e5339;
  --green-deep:#1d3a26;
  --gold:#b78b3f;
  --gold-soft:#e9ddc2;
  --paper:#faf8f1;       /* 한지 배경 */
  --paper-deep:#f1ecdd;
  --line:#e3dac4;
  --radius:4px;          /* 각진 절제미 — 치과(18px 라운드)와 대비 */
  --arch:180px;          /* 아치 곡선 */
  --header-h:64px;
}
html{scroll-behavior:smooth}
body{
  font-family:'Pretendard Variable',Pretendard,-apple-system,BlinkMacSystemFont,system-ui,sans-serif;
  color:var(--ink);background:var(--paper);
  line-height:1.7;letter-spacing:-.005em;
  -webkit-font-smoothing:antialiased;overflow-x:hidden;
}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
ul,ol{list-style:none}
button{font:inherit;cursor:pointer;border:0;background:none}
input,select,textarea{font:inherit;color:inherit}
.container{width:min(1140px,92%);margin:0 auto}
[id]{scroll-margin-top:calc(var(--header-h) + 90px)}

/* ───────── 타이포 ───────── */
.eyebrow{
  display:inline-flex;align-items:center;gap:10px;
  font-size:12.5px;font-weight:700;letter-spacing:.34em;text-transform:uppercase;
  color:var(--gold);margin-bottom:18px;
}
.eyebrow::before{content:"";width:34px;height:1px;background:var(--gold)}
.h-big{font-size:clamp(27px,4.2vw,44px);font-weight:800;line-height:1.32;letter-spacing:-.02em}
.h-big em{font-style:normal;color:var(--green)}
.lead{margin-top:16px;color:var(--ink-soft);font-size:clamp(14px,1.6vw,16.5px)}

/* JS 가 정상 구동될 때만 숨김 — 스크립트 실패 시에도 콘텐츠는 항상 보임 */
html.js .reveal{opacity:0;transform:translateY(30px);transition:opacity .8s cubic-bezier(.22,.61,.36,1),transform .8s cubic-bezier(.22,.61,.36,1)}
html.js .reveal.is-in{opacity:1;transform:none}
.reveal[data-delay="1"]{transition-delay:.12s}
.reveal[data-delay="2"]{transition-delay:.24s}
.reveal[data-delay="3"]{transition-delay:.36s}

/* ───────── 유틸바 + 헤더 ───────── */
.topbar{background:var(--green-deep);color:rgba(255,255,255,.8);font-size:12.5px}
.topbar .inner{width:min(1200px,90%);margin:0 auto;display:flex;justify-content:space-between;padding:7px 0}
.topbar b{color:#e8d3a4;font-weight:600}
.topbar a:hover{color:#fff}
.header{
  position:sticky;top:0;z-index:1000;height:var(--header-h);
  background:rgba(250,248,241,.95);backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);
  display:flex;align-items:center;
}
.header-inner{width:min(1200px,90%);margin:0 auto;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:20px}
.logo{display:flex;align-items:center;gap:11px;justify-self:start}
.logo-seal{
  width:40px;height:40px;border-radius:50%;border:1.5px solid var(--green);
  display:grid;place-items:center;color:var(--green);position:relative;flex-shrink:0;
}
.logo-seal::after{content:"";position:absolute;inset:3px;border-radius:50%;border:1px solid rgba(46,83,57,.3)}
.logo-seal svg{width:19px;height:19px}
.logo-text{position:relative;top:3px}  /* 로고 글자 살짝 아래로 — 심볼과 시각 균형 */
.logo-text strong{font-size:19px;font-weight:800;letter-spacing:.02em;color:var(--green-deep);display:block;line-height:1.2}
.logo-text span{font-size:9.5px;letter-spacing:.32em;color:var(--gold);font-weight:600}
.gnb{display:flex;gap:4px;justify-self:center}
.gnb a{position:relative;padding:9px 16px;font-size:15px;font-weight:600;color:var(--ink)}
.gnb a::after{
  content:"";position:absolute;left:50%;bottom:2px;width:0;height:2px;background:var(--gold);
  transform:translateX(-50%);transition:width .3s;
}
.gnb a:hover::after,.gnb a.active::after{width:calc(100% - 32px)}
.gnb a.active{color:var(--green)}
.header-cta{
  justify-self:end;display:inline-flex;align-items:center;gap:8px;
  padding:10px 20px;border:1.5px solid var(--green);color:var(--green);
  font-weight:700;font-size:14.5px;border-radius:999px;transition:.3s;
}
.header-cta:hover{background:var(--green);color:#fff}
.header-cta svg{width:15px;height:15px}

.burger{display:none;width:42px;height:42px;position:relative;z-index:1102;justify-self:end}
.burger span{position:absolute;left:9px;right:9px;height:2px;background:var(--ink);border-radius:2px;transition:.35s}
.burger span:nth-child(1){top:14px}.burger span:nth-child(2){top:20px}.burger span:nth-child(3){top:26px}
.burger.is-open span:nth-child(1){top:20px;transform:rotate(45deg)}
.burger.is-open span:nth-child(2){opacity:0}
.burger.is-open span:nth-child(3){top:20px;transform:rotate(-45deg)}

/* 모바일 드로어 (우측 슬라이드) */
.m-nav{
  position:fixed;top:0;right:0;bottom:0;width:min(320px,84vw);z-index:1100;
  background:var(--paper);border-left:1px solid var(--line);
  display:flex;flex-direction:column;justify-content:center;padding:0 34px;
  transform:translateX(100%);transition:transform .4s cubic-bezier(.22,.61,.36,1);
  box-shadow:-20px 0 60px rgba(34,31,24,.12);visibility:hidden;
}
.m-nav.is-open{transform:none;visibility:visible}
.m-nav a{
  font-size:19px;font-weight:700;padding:13px 0;border-bottom:1px solid var(--line);
  display:flex;justify-content:space-between;align-items:center;color:var(--ink);
}
.m-nav a::after{content:"→";color:var(--gold);font-size:16px}
.m-nav a.active{color:var(--green)}
.m-nav .m-nav-tel{
  margin-top:26px;border:0;justify-content:center;gap:9px;border-radius:999px;
  background:var(--green);color:#fff;font-size:16.5px;padding:14px;
}
.m-nav .m-nav-tel::after{content:""}

/* ───────── Swiper 미초기화 봉쇄 (CDN 차단/지연 시 레이아웃 붕괴 방지) ───────── */
.swiper:not(.swiper-initialized){overflow:hidden !important}
.hero-visual .swiper:not(.swiper-initialized) .swiper-wrapper{display:block;height:100%}
.hero-visual .swiper:not(.swiper-initialized) .swiper-slide{width:100%;height:100%}
.hero-visual .swiper:not(.swiper-initialized) .swiper-slide:not(:first-child){display:none}
.tour .swiper:not(.swiper-initialized) .swiper-wrapper{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.tour .swiper:not(.swiper-initialized) .swiper-slide{width:auto !important}
.tour .swiper:not(.swiper-initialized) .swiper-slide:nth-child(n+4){display:none}
.t-chips .swiper:not(.swiper-initialized) .swiper-wrapper{display:flex;flex-wrap:wrap}

/* ───────── 분할 히어로 ───────── */
.hero{position:relative;overflow:hidden;background:var(--paper)}
.hero-grid{
  width:min(1280px,94%);margin:0 auto;
  display:grid;grid-template-columns:.92fr 1.08fr;gap:clamp(30px,4vw,60px);
  align-items:center;padding:clamp(40px,6vw,80px) 0 clamp(46px,6vw,84px);
}
/* ★ 그리드 칼럼 폭주 차단 — Swiper 가 그리드 안에 있을 때 필수 (min-width:auto 무한 되먹임 방지) */
.hero-grid>*{min-width:0}
.hero-frame{width:100%;max-width:100%}
.hero-copy{position:relative;padding-left:clamp(0px,3vw,34px)}
.hero-vert{
  position:absolute;left:-12px;top:6px;
  writing-mode:vertical-rl;font-size:12px;letter-spacing:.5em;line-height:2.3;color:var(--gold);
  border-left:1px solid var(--gold-soft);padding-left:10px;height:160px;
}
.hero-copy .eyebrow{margin-bottom:22px}
.hero-title{font-size:clamp(34px,4.8vw,54px);font-weight:800;line-height:1.3;letter-spacing:-.02em}
.hero-title em{font-style:normal;color:var(--green);position:relative;z-index:1}
.hero-title em::after{
  content:"";position:absolute;left:0;right:0;bottom:6px;height:12px;
  background:var(--gold-soft);z-index:-1;
}
.hero-sub{margin-top:22px;font-size:clamp(15px,1.7vw,17px);color:var(--ink-soft);max-width:440px}
.hero-actions{display:flex;gap:12px;margin-top:36px;flex-wrap:wrap}
.btn{
  display:inline-flex;align-items:center;gap:9px;padding:15px 28px;border-radius:999px;
  font-weight:700;font-size:15.5px;transition:.3s;
}
.btn svg{width:16px;height:16px}
.btn-green{background:var(--green);color:#fff;box-shadow:0 10px 24px rgba(46,83,57,.25)}
.btn-green:hover{background:var(--green-deep);transform:translateY(-2px)}
.btn-line{border:1.5px solid var(--ink);color:var(--ink)}
.btn-line:hover{background:var(--ink);color:var(--paper);transform:translateY(-2px)}
.hero-keys{display:flex;gap:22px;margin-top:40px;padding-top:24px;border-top:1px solid var(--line);flex-wrap:wrap}
.hero-keys div b{display:block;font-size:15.5px;color:var(--green-deep)}
.hero-keys div span{font-size:12.5px;color:var(--ink-soft)}
/* 우측 아치 비주얼 — Swiper 터치 슬라이드 + 미초기화 시 CSS 크로스페이드 폴백 */
.hero-visual{position:relative}
.hero-frame{
  position:relative;
  border-radius:var(--arch) var(--arch) var(--radius) var(--radius);
  overflow:hidden;aspect-ratio:4/4.6;box-shadow:0 30px 70px rgba(34,31,24,.16);
}
.hero-frame .hv{background-size:cover,cover;background-position:center}
/* [PHOTO] hero_main_1~3.jpg + 폴백 */
.hv-1{background-image:url('../img/hero_main_1.jpg'),linear-gradient(160deg,#3c6e4c,#1d3a26)}
.hv-2{background-image:url('../img/hero_main_2.jpg'),linear-gradient(200deg,#2e5339,#16301f)}
.hv-3{background-image:url('../img/hero_main_3.jpg'),linear-gradient(140deg,#b78b3f,#7e5c22)}
/* ── 폴백: Swiper 미초기화 동안 CSS 크로스페이드 (빈 화면 원천 차단) ── */
.hero-frame:not(.swiper-initialized) .swiper-wrapper{display:block;position:relative;height:100%}
.hero-frame:not(.swiper-initialized) .hv{position:absolute;inset:0;opacity:0;animation:hvFade 13.8s infinite}
.hero-frame:not(.swiper-initialized) .hv-1{opacity:1;animation:none}
.hero-frame:not(.swiper-initialized) .hv-2{animation-delay:4.6s}
.hero-frame:not(.swiper-initialized) .hv-3{animation-delay:9.2s}
@keyframes hvFade{
  0%{opacity:0}
  5%{opacity:1}
  33.3%{opacity:1}
  40%{opacity:0}
  100%{opacity:0}
}
/* ── 초기화 후: Swiper 터치/드래그 슬라이드 ── */
.hero-frame .swiper-pagination{bottom:16px !important}
.hero-frame .swiper-pagination-bullet{background:#fff;opacity:.55;width:8px;height:8px}
.hero-frame .swiper-pagination-bullet-active{opacity:1;background:var(--gold);width:24px;border-radius:4px}
.hero-stamp{
  position:absolute;left:-26px;bottom:34px;width:92px;height:92px;border-radius:50%;
  background:var(--green-deep);color:#f0e6cf;display:grid;place-items:center;text-align:center;
  font-size:12px;font-weight:700;line-height:1.5;letter-spacing:.1em;
  box-shadow:0 14px 30px rgba(29,58,38,.35);animation:floaty 4.5s ease-in-out infinite;z-index:2;
}
.hero-stamp b{font-size:15px;color:#fff;display:block;letter-spacing:.2em}
@keyframes floaty{0%,100%{transform:translateY(0)}50%{transform:translateY(-9px)}}

/* ───────── 인포바 ───────── */
.infobar{background:var(--green-deep);color:#fff}
.infobar .inner{width:min(1280px,94%);margin:0 auto;display:grid;grid-template-columns:repeat(4,1fr)}
.infobar a,.infobar div{
  padding:18px 22px;display:flex;align-items:center;gap:12px;
  border-right:1px solid rgba(255,255,255,.12);transition:background .3s;font-size:14px;
}
.infobar a:hover{background:rgba(255,255,255,.06)}
.infobar .inner>*:first-child{border-left:1px solid rgba(255,255,255,.12)}
.infobar svg{width:19px;height:19px;color:#e8d3a4;flex-shrink:0}
.infobar b{color:#fff;font-weight:700}
.infobar span{color:rgba(255,255,255,.68)}

/* ───────── 철학 ───────── */
.philosophy{padding:clamp(76px,10vw,120px) 0;text-align:center}
.philosophy .h-big{max-width:700px;margin:0 auto}
.philosophy .lead{max-width:560px;margin-left:auto;margin-right:auto}
.principles{
  display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(24px,4vw,56px);
  margin-top:clamp(44px,6vw,70px);text-align:left;
}
.principle{border-top:2px solid var(--ink);padding-top:22px}
.principle .no{font-size:13px;letter-spacing:.26em;color:var(--gold);font-weight:700;display:block;margin-bottom:12px}
.principle h3{font-size:19.5px;font-weight:800;margin-bottom:9px}
.principle p{font-size:14.5px;color:var(--ink-soft)}

/* ───────── 숫자 한 줄 ───────── */
.stats-line{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--paper-deep)}
.stats-line .inner{width:min(1140px,92%);margin:0 auto;display:grid;grid-template-columns:repeat(4,1fr)}
.stat{padding:30px 10px;text-align:center;border-right:1px solid var(--line)}
.stat:first-child{border-left:1px solid var(--line)}
.stat-num{font-size:clamp(26px,3.4vw,40px);font-weight:800;color:var(--green-deep);line-height:1.1;font-variant-numeric:tabular-nums}
.stat-num small{font-size:.5em;color:var(--gold);font-weight:700;margin-left:2px}
.stat-label{margin-top:6px;font-size:13px;color:var(--ink-soft)}

/* ───────── 프로그램 리스트 행 ───────── */
.programs{padding:clamp(76px,10vw,120px) 0;background:#fff}
.head-row{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;margin-bottom:clamp(30px,4vw,48px);flex-wrap:wrap}
.prog-rows{border-top:1.5px solid var(--ink)}
.prog-row{
  display:grid;grid-template-columns:90px 1.1fr 1.6fr auto;gap:clamp(14px,3vw,40px);
  align-items:center;padding:clamp(20px,3vw,30px) 8px;
  border-bottom:1px solid var(--line);transition:.35s;
}
.prog-row:hover{background:var(--paper);padding-left:22px}
.prog-row .no{font-size:15px;font-weight:700;color:var(--gold);letter-spacing:.12em}
.prog-row h3{font-size:clamp(18px,2.2vw,23px);font-weight:800;letter-spacing:-.01em}
.prog-row h3 small{display:block;font-size:12px;color:var(--gold);font-weight:600;letter-spacing:.14em;margin-top:3px}
.prog-row p{font-size:14.5px;color:var(--ink-soft)}
.prog-row .go{
  width:44px;height:44px;border-radius:50%;border:1.5px solid var(--line);
  display:grid;place-items:center;color:var(--ink);transition:.3s;
}
.prog-row:hover .go{background:var(--green);border-color:var(--green);color:#fff;transform:rotate(-45deg)}
.prog-row .go svg{width:17px;height:17px}
.prog-tag{display:inline-block;font-size:11.5px;font-weight:700;color:var(--green);background:rgba(46,83,57,.08);padding:3px 10px;border-radius:999px;margin-top:7px;margin-right:5px}

/* ───────── 원장 밴드 ───────── */
.doctor-band{padding:clamp(76px,10vw,120px) 0;background:var(--paper)}
.doctor-grid{display:grid;grid-template-columns:1fr .9fr;gap:clamp(36px,6vw,80px);align-items:center}
.doc-quote-mark{font-size:80px;line-height:.6;color:var(--gold);font-weight:800;display:block;margin-bottom:18px}
.doc-quote{font-size:clamp(20px,2.6vw,28px);font-weight:700;line-height:1.55;letter-spacing:-.01em}
.doc-quote em{font-style:normal;color:var(--green)}
.doc-from{margin-top:22px;font-size:14px;color:var(--ink-soft)}
.doc-from b{color:var(--ink);font-size:16px}
.doc-creds{margin-top:26px;display:flex;flex-direction:column;gap:8px}
.doc-creds li{font-size:14px;color:var(--ink-soft);padding-left:16px;position:relative}
.doc-creds li::before{content:"";position:absolute;left:0;top:9px;width:6px;height:6px;background:var(--gold);transform:rotate(45deg)}
.doc-more{margin-top:30px}
.doc-visual{position:relative}
.doc-photo{
  border-radius:var(--arch) var(--arch) var(--radius) var(--radius);overflow:hidden;aspect-ratio:4/5;
  background:linear-gradient(170deg,#3c6e4c,#1d3a26);position:relative;
  box-shadow:0 24px 60px rgba(34,31,24,.16);
}
.doc-photo img{width:100%;height:100%;object-fit:cover}
.doc-name-tag{
  position:absolute;left:18px;bottom:18px;background:rgba(250,248,241,.96);
  padding:12px 18px;border-radius:var(--radius);border-left:3px solid var(--gold);
}
.doc-name-tag b{display:block;font-size:16.5px}
.doc-name-tag span{font-size:12px;color:var(--ink-soft)}

/* ───────── 둘러보기 ───────── */
.tour{padding:clamp(76px,10vw,120px) 0;background:#fff;overflow:hidden}
.tour .swiper{overflow:visible}
.tour-item{display:block}
.tour-pic{
  border-radius:140px 140px var(--radius) var(--radius);overflow:hidden;aspect-ratio:3/3.6;
  background-size:cover,cover;background-position:center;transition:transform .4s;
}
.tour-item:hover .tour-pic{transform:translateY(-8px)}
/* [PHOTO] tour_*.jpg */
.tp-1{background-image:url('../img/tour_desk.jpg'),linear-gradient(160deg,#caa45f,#8a6a2e)}
.tp-2{background-image:url('../img/tour_counsel.jpg'),linear-gradient(160deg,#3c6e4c,#1d3a26)}
.tp-3{background-image:url('../img/tour_chair.jpg'),linear-gradient(160deg,#7e9379,#42563f)}
.tp-4{background-image:url('../img/tour_ct.jpg'),linear-gradient(160deg,#5d7a52,#2e4a2b)}
.tp-5{background-image:url('../img/tour_steril.jpg'),linear-gradient(160deg,#9aa882,#5c6a48)}
.tp-6{background-image:url('../img/tour_powder.jpg'),linear-gradient(160deg,#c2b187,#7d6c44)}
.tour-cap{padding:16px 6px 0;display:flex;justify-content:space-between;align-items:baseline;gap:10px}
.tour-cap b{font-size:16.5px;font-weight:800}
.tour-cap span{font-size:12px;color:var(--gold);letter-spacing:.16em;font-weight:700;flex-shrink:0}
.tour-item>p{font-size:13px;color:var(--ink-soft);padding:4px 6px 0}
.tour-nav{display:flex;gap:8px}
.tour-nav button{
  width:46px;height:46px;border-radius:50%;border:1.5px solid var(--line);
  display:grid;place-items:center;color:var(--ink);transition:.3s;background:#fff;
}
.tour-nav button:hover{background:var(--green);border-color:var(--green);color:#fff}
.tour-nav svg{width:17px;height:17px}
/* about 페이지용 그리드형 */
.tour-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(18px,3vw,30px);margin-top:clamp(30px,4vw,48px)}

/* ───────── 후기: 큰 인용 2단 ───────── */
.quotes{padding:clamp(76px,10vw,120px) 0;background:var(--paper-deep)}
.quotes-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(26px,4vw,54px) clamp(34px,5vw,70px);margin-top:clamp(36px,5vw,56px)}
.quote{border-left:2px solid var(--gold);padding-left:clamp(18px,2.5vw,30px)}
.quote .q-mark{font-size:34px;color:var(--gold);font-weight:800;line-height:1;display:block;margin-bottom:10px}
.quote p{font-size:15.5px;line-height:1.8}
.quote .who{margin-top:14px;font-size:13px;color:var(--ink-soft)}
.quote .who b{color:var(--ink);font-size:14px}

/* ───────── CTA 도장 밴드 ───────── */
.cta-band{position:relative;background:var(--green-deep);color:#fff;overflow:hidden;padding:clamp(64px,9vw,104px) 0}
.cta-band::before{
  content:"";position:absolute;width:480px;height:480px;border-radius:50%;
  border:1px solid rgba(232,211,164,.15);right:-140px;top:-200px;
}
.cta-grid{display:grid;grid-template-columns:auto 1fr auto;gap:clamp(24px,4vw,54px);align-items:center;position:relative}
.cta-seal{
  width:108px;height:108px;border-radius:50%;border:1.5px solid rgba(232,211,164,.5);
  display:grid;place-items:center;text-align:center;color:#e8d3a4;
  font-size:13px;font-weight:700;letter-spacing:.2em;line-height:1.5;
}
.cta-band h2{font-size:clamp(23px,3.4vw,36px);font-weight:800;line-height:1.45}
.cta-band h2 em{font-style:normal;color:#e8d3a4}
.cta-band p{margin-top:10px;color:rgba(255,255,255,.72);font-size:14.5px}
.cta-actions{display:flex;flex-direction:column;gap:10px}
.cta-actions .btn{justify-content:center}
.btn-gold{background:#e8d3a4;color:var(--green-deep)}
.btn-gold:hover{background:#fff;transform:translateY(-2px)}
.btn-ghost{border:1.5px solid rgba(255,255,255,.45);color:#fff}
.btn-ghost:hover{background:rgba(255,255,255,.1)}

/* ───────── 서브페이지 헤드 (타이포형) ───────── */
.page-head{
  background:var(--paper-deep);border-bottom:1px solid var(--line);
  padding:clamp(48px,7vw,84px) 0;position:relative;overflow:hidden;
}
.page-head::after{
  content:"";position:absolute;right:-60px;top:50%;transform:translateY(-50%);
  width:300px;height:300px;border-radius:50%;border:1px solid var(--gold-soft);
}
.page-head .inner{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;flex-wrap:wrap;position:relative;z-index:1}
.page-head h1{font-size:clamp(30px,4.4vw,46px);font-weight:800;letter-spacing:-.02em}
.page-head h1 small{
  display:block;font-size:12.5px;letter-spacing:.3em;color:var(--gold);font-weight:700;margin-bottom:12px;text-transform:uppercase;
}
.page-head .pdesc{margin-top:12px;color:var(--ink-soft);font-size:14.5px;max-width:540px}
.crumb{font-size:13px;color:var(--ink-soft)}
.crumb a:hover{color:var(--green)}
.crumb .here{color:var(--green);font-weight:700}
.crumb .sep{margin:0 7px;opacity:.5}

/* ───────── 칩 탭 (언더라인형 — Swiper freeMode) ───────── */
.t-chips{
  position:sticky;top:var(--header-h);z-index:600;background:rgba(250,248,241,.96);backdrop-filter:blur(8px);
  border-bottom:1px solid var(--line);
  -webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;
}
.t-chips .swiper{overflow:hidden}
.t-chips .swiper-wrapper{display:flex;align-items:center}
.t-chips .swiper-slide{width:auto !important;flex-shrink:0}
.t-chip{
  display:inline-block;padding:15px 18px 13px;font-size:14.5px;font-weight:700;color:var(--ink-soft);
  border-bottom:2.5px solid transparent;transition:.25s;white-space:nowrap;-webkit-user-drag:none;
}
.t-chip:hover{color:var(--ink)}
.t-chip.is-active{color:var(--green);border-bottom-color:var(--gold)}

/* ───────── 프로그램 상세 ───────── */
.t-detail{padding:clamp(60px,8vw,96px) 0;border-bottom:1px solid var(--line)}
.t-detail:nth-of-type(even){background:#fff}
.t-detail-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(34px,5vw,70px);align-items:center}
.t-detail:nth-of-type(even) .t-detail-grid{direction:rtl}
.t-detail:nth-of-type(even) .t-detail-grid>*{direction:ltr}
.t-label{font-size:12.5px;font-weight:700;letter-spacing:.3em;color:var(--gold);display:block;margin-bottom:14px;text-transform:uppercase}
.t-detail h2{font-size:clamp(23px,3vw,31px);font-weight:800;margin-bottom:14px}
.t-detail .desc{color:var(--ink-soft);font-size:15px}
.t-feats{margin-top:22px;display:flex;flex-direction:column;gap:11px}
.t-feats li{font-size:14.5px;padding-left:18px;position:relative}
.t-feats li::before{content:"";position:absolute;left:0;top:10px;width:7px;height:7px;background:var(--gold);transform:rotate(45deg)}
.t-feats b{color:var(--green-deep)}
.t-steps{display:flex;gap:8px;margin-top:24px;flex-wrap:wrap}
.t-steps span{
  font-size:12.5px;font-weight:700;color:var(--green);border:1px solid rgba(46,83,57,.3);
  padding:7px 13px;border-radius:999px;
}
.t-steps i{font-style:normal;color:var(--gold);margin-right:3px}
.t-visual{
  border-radius:var(--arch) var(--arch) var(--radius) var(--radius);aspect-ratio:4/3.4;overflow:hidden;
  background-size:cover,cover;background-position:center;box-shadow:0 20px 50px rgba(34,31,24,.14);
}
.tv-1{background-image:url('../img/hero_main_2.jpg'),linear-gradient(160deg,#3c6e4c,#1d3a26)}
.tv-2{background-image:url('../img/tour_chair.jpg'),linear-gradient(160deg,#7e9379,#42563f)}
.tv-3{background-image:url('../img/tour_counsel.jpg'),linear-gradient(160deg,#caa45f,#8a6a2e)}
.tv-4{background-image:url('../img/tour_ct.jpg'),linear-gradient(160deg,#5d7a52,#2e4a2b)}
.tv-5{background-image:url('../img/tour_powder.jpg'),linear-gradient(160deg,#c2b187,#7d6c44)}
.tv-6{background-image:url('../img/hero_main_3.jpg'),linear-gradient(160deg,#b78b3f,#7e5c22)}

/* ───────── 연혁 ───────── */
.history{padding:clamp(70px,9vw,110px) 0;background:#fff}
.timeline{max-width:720px;margin:clamp(34px,5vw,52px) auto 0}
.timeline li{
  display:grid;grid-template-columns:110px 1fr;gap:clamp(18px,3vw,40px);
  padding:20px 0;border-bottom:1px dashed var(--line);
}
.timeline .tl-year{font-size:21px;font-weight:800;color:var(--gold)}
.timeline p{font-size:15px;color:var(--ink-soft);padding-top:4px}

/* ───────── 진료안내 ───────── */
.info-sec{padding:clamp(70px,9vw,110px) 0}
.info-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(24px,3vw,40px);margin-top:clamp(30px,4vw,48px)}
.info-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:clamp(26px,3.5vw,40px)}
.info-card h3{font-size:19px;font-weight:800;margin-bottom:20px;display:flex;align-items:center;gap:9px}
.info-card h3 svg{width:21px;height:21px;color:var(--gold)}
.hours li{display:flex;justify-content:space-between;padding:12px 2px;border-bottom:1px dashed var(--line);font-size:15px}
.hours li:last-child{border-bottom:0}
.hours .day{font-weight:700}
.hours .day small{color:var(--gold);font-weight:700;margin-left:6px}
.hours .time{color:var(--ink-soft);font-variant-numeric:tabular-nums}
.hours .time b{color:var(--green)}
.hours li.holiday .day,.hours li.holiday .time{color:#b05a4a;font-weight:700}
.hours-note{
  margin-top:16px;padding:13px 16px;background:var(--paper);border-left:3px solid var(--gold);
  font-size:13px;color:var(--ink-soft);line-height:1.65;
}
.side-stack{display:flex;flex-direction:column;gap:18px}
.tel-card{
  background:var(--green-deep);color:#fff;border-radius:var(--radius);padding:30px;flex:1;
  display:flex;flex-direction:column;justify-content:center;position:relative;overflow:hidden;
}
.tel-card::after{content:"";position:absolute;width:200px;height:200px;border-radius:50%;border:1px solid rgba(232,211,164,.2);right:-60px;bottom:-80px}
.tel-card p{font-size:13px;color:rgba(255,255,255,.68)}
.tel-card a{font-size:clamp(26px,3vw,32px);font-weight:800;letter-spacing:.01em;color:#e8d3a4}
.tel-card span{margin-top:10px;font-size:12.5px;color:rgba(255,255,255,.58)}
.kakao-card{
  background:#fae64d;border-radius:var(--radius);padding:22px 26px;display:flex;align-items:center;gap:14px;color:#3a2929;transition:.3s;
}
.kakao-card:hover{transform:translateY(-3px)}
.kakao-card svg{width:30px;height:30px;flex-shrink:0}
.kakao-card b{font-size:15.5px;display:block}
.kakao-card span{font-size:12.5px;opacity:.72}
.book-steps{display:grid;grid-template-columns:repeat(4,1fr);margin-top:clamp(30px,4vw,48px);border-top:1.5px solid var(--ink)}
.book-step{padding:26px 18px;border-right:1px dashed var(--line)}
.book-step:last-child{border-right:0}
.book-step .no{font-size:13px;color:var(--gold);font-weight:800;letter-spacing:.2em;display:block;margin-bottom:10px}
.book-step h4{font-size:16.5px;font-weight:800;margin-bottom:6px}
.book-step p{font-size:13px;color:var(--ink-soft)}
.loc-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(22px,3vw,36px);margin-top:clamp(30px,4vw,48px)}
.map-box{
  border-radius:var(--radius);min-height:380px;border:1px solid var(--line);
  background:
    linear-gradient(rgba(46,83,57,.05) 1px,transparent 1px),
    linear-gradient(90deg,rgba(46,83,57,.05) 1px,transparent 1px),
    var(--paper-deep);
  background-size:32px 32px,32px 32px;
  display:grid;place-items:center;text-align:center;
}
.map-box .pin{
  width:54px;height:54px;border-radius:50%;background:var(--green);color:#fff;
  display:grid;place-items:center;margin:0 auto 12px;animation:floaty 3.5s ease-in-out infinite;
}
.map-box .pin svg{width:23px;height:23px}
.map-box b{font-size:16px;display:block}
.map-box span{font-size:12.5px;color:var(--ink-soft)}
.loc-list{display:flex;flex-direction:column;gap:14px}
.loc-item{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:20px 22px;display:flex;gap:14px}
.loc-item svg{width:20px;height:20px;color:var(--gold);flex-shrink:0;margin-top:3px}
.loc-item h4{font-size:15px;font-weight:800;margin-bottom:3px}
.loc-item p{font-size:13.5px;color:var(--ink-soft);line-height:1.6}
.loc-item b{color:var(--green)}

/* ───────── 상담 폼 (언더라인형) ───────── */
.consult-sec{padding:clamp(70px,9vw,110px) 0;background:#fff}
.consult-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(34px,6vw,80px)}
.consult-side .steps{margin-top:30px;display:flex;flex-direction:column}
.consult-side .steps li{padding:18px 0;border-bottom:1px dashed var(--line);display:flex;gap:16px;align-items:flex-start}
.consult-side .steps .no{font-size:13px;color:var(--gold);font-weight:800;letter-spacing:.14em;padding-top:3px;flex-shrink:0}
.consult-side .steps h4{font-size:16px;font-weight:800}
.consult-side .steps p{font-size:13px;color:var(--ink-soft)}
.consult-form .form-row{display:grid;grid-template-columns:1fr 1fr;gap:26px;margin-bottom:26px}
.form-field{display:flex;flex-direction:column;gap:6px}
.form-field.full{grid-column:1/-1}
.form-field label{font-size:12.5px;font-weight:800;letter-spacing:.08em;color:var(--green-deep)}
.form-field label em{color:#b05a4a;font-style:normal}
.form-field input,.form-field select,.form-field textarea{
  border:0;border-bottom:1.5px solid var(--line);background:transparent;
  padding:10px 2px;font-size:15.5px;transition:border-color .3s;border-radius:0;width:100%;
}
.form-field textarea{resize:vertical;min-height:90px}
.form-field input:focus,.form-field select:focus,.form-field textarea:focus{outline:0;border-bottom-color:var(--green)}
.form-agree{display:flex;gap:9px;font-size:12.5px;color:var(--ink-soft);margin:4px 0 24px;align-items:flex-start}
.form-agree input{width:16px;height:16px;margin-top:2px;accent-color:var(--green)}
.form-agree a{text-decoration:underline;text-underline-offset:3px}
.form-submit{
  width:100%;padding:17px;background:var(--green);color:#fff;font-size:16.5px;font-weight:800;
  border-radius:999px;transition:.3s;display:flex;justify-content:center;align-items:center;gap:9px;
}
.form-submit:hover{background:var(--green-deep);transform:translateY(-2px)}
.form-submit svg{width:17px;height:17px}

/* ───────── FAQ ───────── */
.faq{padding:clamp(70px,9vw,110px) 0}
.faq-list{max-width:780px;margin:clamp(30px,4vw,48px) auto 0;border-top:1.5px solid var(--ink)}
.faq-list details{border-bottom:1px solid var(--line)}
.faq-list summary{
  list-style:none;cursor:pointer;display:flex;align-items:center;gap:16px;
  padding:20px 4px;font-size:16px;font-weight:700;
}
.faq-list summary::-webkit-details-marker{display:none}
.faq-list summary .q{color:var(--gold);font-weight:800;font-size:15px;flex-shrink:0}
.faq-list summary .chev{margin-left:auto;color:var(--ink-soft);transition:transform .3s;flex-shrink:0}
.faq-list details[open] summary .chev{transform:rotate(180deg)}
.faq-list details[open] summary{color:var(--green)}
.faq-list .faq-a{padding:0 4px 22px 36px;font-size:14.5px;color:var(--ink-soft);line-height:1.8}

/* ───────── 푸터 (라이트) ───────── */
.footer{background:var(--paper-deep);border-top:1px solid var(--line);padding:54px 0 100px;font-size:13.5px;color:var(--ink-soft)}
.footer-grid{display:grid;grid-template-columns:1.3fr 1fr 1.2fr;gap:38px;margin-bottom:32px}
.footer .logo-text strong{color:var(--green-deep)}
.footer-about{margin-top:14px;line-height:1.8;max-width:300px}
.footer h5{color:var(--ink);font-size:14.5px;margin-bottom:14px;font-weight:800}
.footer-links li{margin-bottom:8px}
.footer-links a:hover{color:var(--green)}
.footer-contact li{margin-bottom:8px;display:flex;gap:8px}
.footer-contact b{color:var(--ink);font-weight:700;flex-shrink:0}
.footer-bottom{border-top:1px solid var(--line);padding-top:20px;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;font-size:12px}

/* ───────── 플로팅 & 모바일 CTA ───────── */
.floating{position:fixed;right:20px;bottom:24px;z-index:900;display:flex;flex-direction:column;gap:10px}
.float-btn{
  width:52px;height:52px;border-radius:14px;display:grid;place-items:center;color:#fff;
  box-shadow:0 10px 26px rgba(34,31,24,.25);transition:transform .25s;
}
.float-btn:hover{transform:translateY(-3px)}
.float-btn svg{width:22px;height:22px}
.float-tel{background:var(--green)}
.float-kakao{background:#fae64d;color:#3a2929}
.float-top{background:#fff;color:var(--ink);border:1px solid var(--line);opacity:0;visibility:hidden;transition:.3s}
.float-top.show{opacity:1;visibility:visible}
.m-cta{display:none}

/* ───────── 반응형 ───────── */
@media (max-width:1080px){
  .gnb{display:none}
  .header-cta{display:none}
  .header-inner{grid-template-columns:1fr auto}
  .burger{display:block}
  .infobar .inner{grid-template-columns:1fr 1fr}
  .principles{grid-template-columns:1fr 1fr}
  .quotes-grid{grid-template-columns:1fr}
  .book-steps{grid-template-columns:1fr 1fr}
  .tour-grid{grid-template-columns:1fr 1fr}
}
@media (max-width:880px){
  .topbar{display:none}
  .hero-grid{grid-template-columns:1fr;gap:34px}
  .hero-visual .swiper{aspect-ratio:4/3.4;border-radius:110px 110px var(--radius) var(--radius)}
  .hero-stamp{left:auto;right:14px;bottom:-16px;width:82px;height:82px;font-size:11px}
  .hero-vert{display:none}
  .doctor-grid,.consult-grid,.loc-grid,.info-grid,.t-detail-grid{grid-template-columns:1fr}
  .t-detail:nth-of-type(even) .t-detail-grid{direction:ltr}
  .doc-visual{max-width:420px}
  .cta-grid{grid-template-columns:1fr;text-align:center}
  .cta-seal{margin:0 auto}
  .cta-actions{flex-direction:row;justify-content:center;flex-wrap:wrap}
  .prog-row{grid-template-columns:54px 1fr auto;grid-template-areas:"no title go" "no desc go"}
  .prog-row .no{grid-area:no}
  .prog-row h3{grid-area:title}
  .prog-row p{grid-area:desc;margin-top:4px}
  .prog-row .go{grid-area:go}
  .footer-grid{grid-template-columns:1fr 1fr}
  .timeline li{grid-template-columns:80px 1fr}
}
@media (max-width:640px){
  :root{--header-h:58px}
  .infobar .inner{grid-template-columns:1fr}
  .infobar a,.infobar div{border-right:0;border-bottom:1px solid rgba(255,255,255,.12);padding:14px 18px}
  .principles{grid-template-columns:1fr}
  .stats-line .inner{grid-template-columns:1fr 1fr}
  .stat:nth-child(odd){border-left:1px solid var(--line)}
  .stat:nth-child(-n+2){border-bottom:1px solid var(--line)}
  .book-steps{grid-template-columns:1fr}
  .book-step{border-right:0;border-bottom:1px dashed var(--line)}
  .consult-form .form-row{grid-template-columns:1fr}
  .tour-grid{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr;gap:26px}
  .footer{padding-bottom:128px}
  .floating{right:14px;bottom:84px}
  .float-tel{display:none}
  .m-cta{
    display:grid;grid-template-columns:1fr 1fr;position:fixed;left:0;right:0;bottom:0;z-index:950;
    background:#fff;border-top:1px solid var(--line);box-shadow:0 -8px 24px rgba(34,31,24,.1);
  }
  .m-cta a{display:flex;align-items:center;justify-content:center;gap:7px;padding:15px 10px;font-weight:800;font-size:15px}
  .m-cta a svg{width:17px;height:17px}
  .m-cta .m-tel{color:var(--green)}
  .m-cta .m-book{background:var(--green);color:#fff}
}