.procedure-page{--detail-gutter:clamp(24px,6.25vw,120px)}
.detail-shell{width:min(1680px,calc(100% - var(--detail-gutter)*2));margin-inline:auto}
.detail-wide{width:min(1760px,calc(100% - clamp(24px,4.17vw,80px)*2));margin-inline:auto}
.procedure-page .home-header:not(.is-scrolled):not(.is-menu-open){background:var(--paper)}
.procedure-page .section-head .body-copy{font-size:clamp(15px,.94vw,18px);}


.detail-hero{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(340px,1fr);align-items:center;gap:clamp(48px,4vw,76px);padding-top:30px}
.detail-hero-image{aspect-ratio:1.2;overflow:hidden;border-radius:30px;background:#eef2f4}
.detail-hero-image img{width:100%;height:100%;object-fit:cover;object-position:50% 38%}
.detail-hero-copy{max-width:570px;padding-block:12px;color:var(--purple-ink)}
.detail-hero-copy h1{font-size:clamp(32px,2.8vw,44px);line-height:1.25;color:var(--purple-ink)}
.detail-hero-subtitle{margin-top:24px;font-size:var(--type-card);font-weight:500;line-height:1.5;color:var(--purple-ink)}
.detail-hero-description{margin-top:20px;font-size:var(--text-body);line-height:1.85}
.detail-facts{margin-top:34px;font-size:var(--text-body-small);line-height:1.6}
.detail-facts dl{display:grid;gap:12px}
.detail-facts dl>div{display:grid;grid-template-columns:116px 1fr;gap:16px}
.detail-facts dt{display:flex;align-items:center;gap:12px;font-weight:500}
.detail-facts dd{color:var(--body)}
.detail-fact-icon{width:19px;height:19px;flex:0 0 19px;stroke-width:1.3}
.detail-book{display:inline-flex;align-items:center;justify-content:center;gap:20px;margin-top:32px;background:var(--purple-soft);color:var(--purple-ink);padding:13px 24px;font-size:var(--text-body-small);font-weight:var(--weight-medium);transition:background .2s}
.detail-book:hover{background:var(--purple-line)}
.detail-book .ui-arrow{width:17px;height:17px}
.detail-recommendations{margin-top:44px;text-align:center;border-block:1px solid var(--purple-line)}
.detail-recommendation-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));background:transparent}
.detail-recommendation-grid li{position:relative;display:grid;grid-template-rows:38px auto;justify-items:center;align-items:center;align-content:start;gap:18px;padding:32px 26px;color:var(--purple-ink);font-size:clamp(15px,.94vw,18px);font-weight:var(--weight-medium);line-height:1.7}
.detail-recommendation-grid li:not(:last-child)::after{content:'';position:absolute;right:0;top:50%;width:1px;height:64px;transform:translateY(-50%);background:#ddd7e7}
.detail-recommendation-icon{display:block;width:38px;height:38px;fill:none;stroke:var(--purple);stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round}
.detail-recommendation-copy{align-self:start;max-width:290px;text-wrap:pretty}

.detail-statement{padding-block:112px 128px;text-align:center}
.detail-statement h2{font-size:clamp(25px,1.77vw,34px);line-height:1.6}
.detail-points{border-top:1px solid var(--line)}
.detail-point{border-bottom:1px solid var(--line)}
.detail-point-inner{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:clamp(48px,5vw,96px);align-items:center;padding:18px 24px 18px max(var(--detail-gutter),calc((100% - 1680px)/2));min-height:220px}
.detail-point-copy{padding-block:16px}
.detail-step{font-family:var(--serif);font-size:var(--text-card-small);color:var(--muted);margin-bottom:8px;letter-spacing:0}
.detail-point h3{font-size:clamp(20px,1.25vw,24px);line-height:1.5;margin-bottom:12px}
.detail-point-copy>p:last-child{max-width:750px;font-size:clamp(15px,.94vw,18px);line-height:1.85}
.detail-point figure{height:clamp(180px,9.6vw,190px);overflow:hidden}
.detail-point img{width:100%;height:100%;object-fit:cover;object-position:50% 50%;filter:grayscale(1)}

.detail-threads{padding-bottom:0}
.detail-thread-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;width:min(1440px,calc(100% - var(--detail-gutter)*2));margin-inline:auto;padding:16px;background:var(--soft)}
.detail-thread-card{background:var(--paper);text-align:center;min-width:0}
.detail-thread-card figure{height:200px;padding:18px 28px;display:grid;place-items:center}
.detail-thread-card img{width:100%;height:100%;object-fit:contain;min-height:0}
.detail-thread-card h3{font-size:var(--text-card-small);padding:12px 18px;background:#ded9ee;color:var(--purple-ink);font-weight:600}
.detail-thread-copy{padding:20px 20px 28px}
.detail-thread-tags{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-bottom:16px}
.detail-thread-tags li{border-radius:30px;background:var(--soft);padding:3px 14px;font-size:var(--text-caption);line-height:1.6;color:var(--purple-ink)}
.detail-thread-copy p{font-size:var(--text-body-medium);line-height:1.85}

.detail-comparison-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(24px,2.6vw,50px)}
.detail-comparison-frame{position:relative;isolation:isolate;aspect-ratio:1.5;background:#e8ebed;overflow:hidden}
.detail-comparison-frame>img,.detail-comparison-before,.detail-comparison-before img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 38%}
.detail-comparison-before{clip-path:inset(0 calc(100% - var(--comparison-position)) 0 0);z-index:1}
.detail-comparison-label{position:absolute;bottom:14px;z-index:2;font-size:var(--text-caption-small);letter-spacing:0;color:var(--ink);background:#ffffffd9;border-radius:20px;padding:3px 11px;pointer-events:none}
.detail-comparison-label--before{left:14px}
.detail-comparison-label--after{right:14px}
.detail-comparison-divider{position:absolute;top:0;bottom:0;left:var(--comparison-position);width:2px;background:white;transform:translateX(-50%);z-index:3;pointer-events:none}
.detail-comparison-divider>span{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:54px;height:54px;border-radius:50%;display:grid;place-items:center;background:white;box-shadow:0 2px 12px #34333820}
.detail-comparison-divider svg{width:30px;height:24px;fill:none;stroke:var(--purple-ink);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.detail-comparison-range{position:absolute;inset:0;z-index:4;width:100%;height:100%;margin:0;opacity:0;cursor:ew-resize;touch-action:pan-y}
.detail-comparison-frame:focus-within{outline:2px solid var(--purple);outline-offset:5px}

.detail-education{background:var(--soft)}
.detail-education-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:28px}
.detail-education-grid figure{aspect-ratio:.94;overflow:hidden}
.detail-education-grid img{width:100%;height:100%;object-fit:cover;object-position:65% 50%;filter:none}

.procedure-page .doctor{padding-bottom:0}
.procedure-page .doctor-grid{gap:clamp(40px,4vw,80px)}
.procedure-page .expertise{margin-top:var(--section-space)}
.detail-post-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--grid-gap)}
.detail-post-grid a{display:block}
.detail-post-grid img{width:100%;aspect-ratio:16 / 10;object-fit:cover;object-position:50% 60%;filter:grayscale(1)}
.detail-post-grid h3{font-size:var(--text-card-large);line-height:1.5;margin:26px 0 16px;transition:color .2s}
.detail-post-grid p{font-size:var(--text-body);line-height:1.8}
.detail-post-grid a:hover h3{color:var(--purple)}
.procedure-page .youtube{border-top:1px solid var(--line)}
.procedure-page .reservation{padding-top:clamp(56px,5vw,96px)}

@media(min-width:1000px) and (max-width:1399px){
  .detail-hero{grid-template-columns:minmax(0,1.35fr) minmax(300px,1fr);gap:48px}
  .detail-hero-image{aspect-ratio:1.05}
  .detail-hero-subtitle{font-size:var(--text-card-medium)}
  .detail-hero-description{font-size:var(--text-body-small)}
  .detail-hero-description br{display:none}
  .detail-facts{margin-top:28px}
  .detail-book{margin-top:28px}
}
@media(max-width:1100px){
  .detail-point-inner{gap:36px}
  .detail-thread-grid{gap:16px}
  .detail-thread-card figure{height:170px;padding:20px}
  .detail-thread-copy{padding:18px 16px 24px}
  .detail-thread-tags{gap:6px}
  .detail-thread-tags li{font-size:var(--text-tiny);padding:3px 10px}
  .detail-thread-copy p{font-size:var(--text-body-small)}
  .detail-thread-copy p br{display:none}
  .detail-education-grid{gap:20px}
  .procedure-page .doctor-grid{grid-template-columns:.9fr 1.1fr;gap:36px}
  .procedure-page .doctor-photo{aspect-ratio:.9}
  .procedure-page .credentials{grid-template-columns:1fr;font-size:var(--text-small);gap:24px}
  .procedure-page .credentials>ul{columns:2;column-gap:20px}
  .procedure-page .credentials li{break-inside:avoid}
  .detail-post-grid h3{font-size:var(--text-card-small)}
}
@media(max-width:999px){
  .detail-hero{grid-template-columns:1fr;gap:38px}
  .detail-hero-image{aspect-ratio:1.3}
  .detail-hero-copy{width:100%;max-width:600px;margin-inline:auto;padding:0}
  .detail-hero-description br{display:none}
  .detail-recommendations{margin-top:60px}
  .detail-recommendation-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .detail-recommendation-grid li{padding:28px 24px}
  .detail-recommendation-grid li:nth-child(2n)::after{display:none}
  .detail-recommendation-grid li:nth-child(n+3)::before{content:'';position:absolute;top:0;left:50%;width:64px;height:1px;transform:translateX(-50%);background:#ddd7e7}
  .detail-statement{padding-block:88px}
  .detail-statement h2 br{display:none}
  .detail-thread-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .detail-comparison-grid{gap:18px}
  .detail-comparison-frame{aspect-ratio:1.1}
  .detail-comparison-divider>span{width:42px;height:42px}
  .detail-comparison-label{font-size:var(--text-micro);bottom:10px;padding:3px 8px}
  .detail-comparison-label--before{left:8px}
  .detail-comparison-label--after{right:8px}
  .detail-education-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
  .detail-education .body-copy br{display:none}
}
@media(max-width:760px){
  .procedure-page{--detail-gutter:24px}
  
  .detail-hero{padding-top:24px;gap:30px}
  .detail-hero-image{border-radius:22px;aspect-ratio:1.16}
  .detail-hero-copy h1{font-size:var(--text-hero-mobile)}
  .detail-hero-subtitle{font-size:var(--text-card);margin-top:18px}
  .detail-hero-description{font-size:var(--text-body-small);margin-top:16px}
  .detail-facts{margin-top:28px;font-size:var(--text-small)}
  .detail-facts dl{gap:11px}
  .detail-book{display:flex;width:100%;justify-content:space-between;margin-top:28px}
  .detail-recommendations{margin-top:48px}
  .detail-recommendation-grid li{font-size:var(--text-small);padding:26px 16px;grid-template-rows:32px auto;gap:14px}
  .detail-recommendation-icon{width:32px;height:32px}
  .detail-recommendation-grid li br{display:none}
  .detail-recommendation-grid li:not(:last-child)::after{top:0;height:100%;transform:none}
  .detail-recommendation-grid li:nth-child(n+3)::before{left:0;width:100%;transform:none}
  .detail-statement{padding-block:76px}
  .detail-statement h2{font-size:var(--text-subheading-small);line-height:1.65}
  .detail-point-inner{grid-template-columns:1fr;gap:22px;padding:30px 24px}
  .detail-point-copy{padding:0}
  .detail-step{font-size:var(--text-body-medium)}
  .detail-point h3{font-size:var(--text-card-medium)}
  .detail-point-copy>p:last-child{font-size:var(--text-body-small)}
  .detail-point figure{height:auto;min-height:0;aspect-ratio:3}
  .detail-point img{height:100%;min-height:0;max-height:none}
  .detail-thread-grid{width:calc(100% - 32px);padding:10px;gap:12px}
  .detail-thread-card figure{height:135px;padding:14px}
  .detail-thread-card h3{font-size:var(--text-body);padding:11px 8px}
  .detail-thread-copy{padding:16px 12px 20px}
  .detail-thread-tags{gap:5px;margin-bottom:12px}
  .detail-thread-tags li{font-size:var(--text-micro);padding:3px 8px}
  .detail-thread-copy p{font-size:var(--text-caption);line-height:1.75}
  .detail-comparison-grid{grid-template-columns:1fr;gap:24px;max-width:540px}
  .detail-comparison-frame{aspect-ratio:1.5}
  .detail-comparison-divider>span{width:48px;height:48px}
  .detail-comparison-label{font-size:var(--text-tiny);bottom:12px}
  .detail-comparison-label--before{left:12px}
  .detail-comparison-label--after{right:12px}
  
  .detail-education-grid{gap:16px}
  .procedure-page .doctor-grid{grid-template-columns:1fr;gap:32px}
  .procedure-page .doctor-photo{aspect-ratio:1.1}
  .procedure-page .credentials{grid-template-columns:1fr 1fr;font-size:var(--text-caption);gap:20px}
  .procedure-page .credentials>ul{columns:auto}
  .detail-post-grid{grid-template-columns:1fr;gap:38px}
  .detail-post-grid img{aspect-ratio:16 / 10}
  .detail-post-grid h3{font-size:var(--text-card);margin:20px 0 12px}
  .detail-post-grid p{font-size:var(--text-body-small)}
}
@media(max-width:380px){
  .procedure-page{--detail-gutter:20px}
  .detail-point-inner{padding-inline:20px}
  .detail-thread-grid{grid-template-columns:1fr;width:calc(100% - 40px);gap:16px}
  .detail-thread-card figure{height:170px}
  .detail-thread-copy p{font-size:var(--text-body-small)}
  .detail-thread-tags li{font-size:var(--text-caption-small)}
  .procedure-page .credentials{grid-template-columns:1fr;font-size:var(--text-small)}
  .procedure-page .credentials>ul{columns:2}
}

.procedure-page .reservation{border-top:0}
.procedure-page .reservation::before{content:none;display:none}

.detail-post-grid img.care-post-source{object-fit:cover;object-position:center;filter:none;background:var(--soft)}

.detail-point img,.detail-post-grid img{filter:none}
.detail-threads{background:var(--soft)}
.detail-thread-grid{background:transparent;padding-inline:0}
.detail-point img[src*="thread-mint-lift-lineup"]{object-fit:contain;background:#fff}
.procedure-page .youtube{border-top:0}

@media (min-width:1440px){
  .detail-hero .detail-hero-image{width:100%;max-height:640px}
}

/* Keep the original step dimensions and frame the relevant subject. */
.detail-point img[src$="ai3d-device-01.jpg"]{width:100%;object-fit:cover;object-position:50% 18%}
.detail-point img[src$="procedure-01.jpg"]{width:100%;object-fit:cover;object-position:50% 8%}
.detail-point img[src$="aube-clinic-recovery-care.jpg"]{object-fit:cover;object-position:50% 100%}
.detail-education-grid img[src$="education-live-demonstration-01.jpg"]{object-position:52% 50%}
.detail-education-grid img[src$="education-live-demonstration-02.jpg"]{object-position:42% 60%}
.detail-education-grid img[src$="education-conference-lecture.jpg"]{object-position:55% 50%}
.detail-education-grid img[src$="education-certificate-presentation.jpg"]{object-position:50% 50%}

/* Match the subject framing across shared consultation and procedure photos. */
.detail-point img[src$="aube-clinic-director-consultation.jpg"]{object-position:50% 25%}
.detail-point img[src$="aube-clinic-director-treatment.png"]{object-position:50% 15%}

.detail-point img[src$="ai3d-device-wide.png"]{width:100%;object-fit:cover;object-position:50% 0%}

/* 실 종류 한눈에 보기 표(2026-10-23 · 병원 답 「실 종류별 권장 부위·실 개수」) — 실 이름으로 찾고 온 분이 한 표에서 비교 */
.thread-compare{margin:56px auto 0;padding-bottom:var(--section-space)}
.thread-compare h3{text-align:center;color:var(--purple-ink);margin-bottom:24px}
.thread-compare table{width:100%;border-collapse:collapse;background:var(--paper);font-size:var(--text-body-small);line-height:1.6}
.thread-compare th,.thread-compare td{padding:16px 18px;text-align:left;vertical-align:top;border-bottom:1px solid var(--line)}
.thread-compare thead th{font-size:var(--text-caption);font-weight:var(--weight-medium);color:var(--muted);background:var(--soft)}
.thread-compare tbody th{color:var(--purple-ink);font-weight:var(--weight-medium);white-space:nowrap}
.thread-compare tbody th small,.thread-compare tbody th span{display:block;font-size:var(--text-caption);font-weight:400;color:var(--muted)}
.thread-compare-note{margin-top:16px;font-size:var(--text-caption);color:var(--muted);text-align:center}
.thread-compare-note b{color:var(--purple-ink);font-weight:var(--weight-medium)}
@media(max-width:760px){
  .thread-compare{margin-top:40px;width:calc(100% - 40px)}
  .thread-compare thead{display:none}
  .thread-compare table,.thread-compare tbody,.thread-compare tr,.thread-compare th,.thread-compare td{display:block;width:100%}
  .thread-compare tr{padding:16px;margin-bottom:10px;border:1px solid var(--line);background:var(--paper)}
  .thread-compare th,.thread-compare td{padding:0;border:0}
  .thread-compare tbody th{white-space:normal;margin-bottom:10px;font-size:var(--text-body)}
  .thread-compare td{display:grid;grid-template-columns:96px 1fr;gap:8px;padding:4px 0;font-size:var(--text-caption)}
  .thread-compare td::before{content:attr(data-label);color:var(--muted)}
  .thread-compare-note{text-align:left}
}
/* 실 카드 4장(2026-10-23 · 병원 「지금 쓰는 실」 목록에 없는 실루엣 픽스·QTL 내림) — 넓은 화면 4칸 한 줄, 그 아래는 2칸(3칸이면 1장이 남음) */
@media(min-width:1200px){.detail-thread-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}