/* 제출 전 검토 — 법률사무소 해내 · 강성신 변호사
   색 체계는 해내 사이트 결정(2026-10-20)을 따른다: 남색 도입부 → 밝은 해결 구간, 상담 버튼 파랑,
   고친 문장은 파랑, 주황빨강은 기한·위험에만. 빨간 펜은 위험 표시라 같은 계열로 둔다.
   구분은 선보다 여백과 옅은 면으로 한다. */
@font-face{font-family:"HN Pen";src:url(fonts/pen.woff2) format("woff2");font-display:swap}
@font-face{font-family:"HN Doc";src:url(fonts/doc.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"HN Doc";src:url(fonts/doc-bold.woff2) format("woff2");font-weight:700;font-display:swap}
:root{
  --navy:#0f172a;--navy-2:#13213d;--navy-3:#1e293b;--navy-4:#273449;
  --ink:#0f172a;--text:#1e293b;--muted:#475569;--soft:#64748b;
  --paper:#fff;--mist:#f8fafc;--cloud:#eef2f7;--tint:rgba(15,23,42,.045);--tint-2:rgba(15,23,42,.075);
  --w-tint:rgba(255,255,255,.07);--w-tint-2:rgba(255,255,255,.12);--w-muted:#a7b3c6;
  --blue:#2563eb;--blue-d:#1d4ed8;--blue-l:#dbeafe;--sky:#93b4ff;
  --green:#1d4ed8;--green-2:#2563eb;--green-l:#dbeafe;
  --urgent:#c2410c;--urgent-2:#ea580c;--urgent-l:#fff1e6;--orange:#fdba74;
  --pen:#d23a1c;--pen-l:rgba(210,58,28,.09);
  --doc:#fffdf8;--doc-ink:#22252b;
  --kakao:#fee500;
  --r:20px;--r-s:12px;--shadow:0 30px 70px rgba(2,8,23,.22);--shadow-s:0 12px 30px rgba(15,23,42,.10);
  --wrap:1200px;--gut:20px;--hd:64px
}
@media(min-width:768px){:root{--gut:36px}}
@media(min-width:1024px){:root{--hd:74px}}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:calc(var(--hd) + 18px)}
body{margin:0;background:var(--paper);color:var(--text);font-family:"Pretendard Variable",Pretendard,"Apple SD Gothic Neo","Noto Sans KR",sans-serif;font-size:16px;line-height:1.72;word-break:keep-all;overflow-wrap:break-word;line-break:strict;-webkit-font-smoothing:antialiased;overflow-x:hidden}
@media(min-width:1024px){body{font-size:17px}}
h1,h2,h3,h4,p,ul,ol,dl,dd,figure,blockquote{margin:0}
ul,ol{padding:0;list-style:none}
h1,h2,h3{color:var(--ink);text-wrap:balance}
p{text-wrap:pretty}
a{color:inherit;text-decoration:none}
button,input,textarea,select{font:inherit;color:inherit}
img,svg,video{display:block;max-width:100%}
img{height:auto}
[hidden]{display:none!important}
:focus-visible{outline:3px solid #93b4ff;outline-offset:3px;border-radius:6px}
.sr{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.skip{position:absolute;left:12px;top:-80px;z-index:300;padding:12px 16px;border-radius:10px;background:#fff;color:var(--navy);font-weight:700}
.skip:focus{top:12px}
.wrap{width:min(calc(100% - var(--gut)*2),var(--wrap));margin-inline:auto}
.ln{display:block}
br.d{display:none}@media(min-width:768px){br.d{display:inline}}
.nw{white-space:nowrap}

/* 버튼 */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:56px;padding:14px 26px;border:0;border-radius:999px;font-size:16.5px;font-weight:760;line-height:1.2;cursor:pointer;white-space:nowrap;transition:transform .18s ease,background-color .18s ease,box-shadow .18s ease}
.btn svg{width:20px;height:20px;flex:none}
.btn:active{transform:translateY(1px)}
.btn-blue{background:var(--blue);color:#fff;box-shadow:0 14px 34px rgba(37,99,235,.38)}
.btn-blue:hover{background:var(--blue-d)}
.btn-line{background:var(--w-tint);color:#fff;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.22)}
.btn-line:hover{background:var(--w-tint-2)}
.btn-ink{background:var(--tint);color:var(--ink);box-shadow:inset 0 0 0 1.5px rgba(15,23,42,.14)}
.btn-ink:hover{background:var(--tint-2)}
.btn-kakao{background:var(--kakao);color:#191600}
.btn-kakao:hover{background:#f5dc00}
.btn .arr{transition:transform .2s ease}
.btn:hover .arr{transform:translateX(3px)}
.nudge .arr{animation:nudge 2.4s ease-in-out infinite}
@keyframes nudge{0%,70%,100%{transform:translateX(0)}80%{transform:translateX(5px)}90%{transform:translateX(0)}}
.tlink{display:inline-flex;align-items:center;gap:6px;font-weight:720;color:var(--blue)}
.tlink svg{width:16px;height:16px;transition:transform .2s}
.tlink:hover svg{transform:translateX(3px)}
.dark .tlink{color:var(--sky)}

/* 머리글 */
.hd{position:sticky;top:0;z-index:100;background:rgba(15,23,42,.94);backdrop-filter:saturate(1.4) blur(12px);-webkit-backdrop-filter:saturate(1.4) blur(12px);color:#fff}
.hd-in{display:flex;align-items:center;gap:18px;height:var(--hd)}
.logo{display:flex;align-items:center;gap:11px;margin-right:auto;min-width:0}
.logo svg{width:30px;height:35px;color:#fff;flex:none}
.logo b{display:block;font-size:17px;font-weight:800;letter-spacing:-.02em;line-height:1.15}
.logo small{display:block;font-size:11.5px;color:var(--w-muted);line-height:1.3;white-space:nowrap}
.gnb{display:none;gap:4px}
.gnb a{padding:8px 12px;border-radius:10px;font-size:15px;font-weight:650;color:#dbe3ef}
.gnb a:hover,.gnb a[aria-current=page]{background:var(--w-tint);color:#fff}
.hd-cta{display:none;min-height:46px;padding:10px 20px;font-size:15px}
.menu-btn{display:inline-flex;align-items:center;justify-content:center;width:46px;height:46px;border:0;border-radius:12px;background:var(--w-tint);color:#fff;cursor:pointer}
.menu-btn svg{width:22px;height:22px}
@media(min-width:1100px){.gnb{display:flex}.hd-cta{display:inline-flex}.menu-btn{display:none}}
.mnav{position:fixed;inset:var(--hd) 0 0;z-index:99;background:var(--navy);padding:18px var(--gut) 40px;overflow:auto}
.mnav a.m{display:flex;justify-content:space-between;align-items:center;padding:16px 4px;font-size:20px;font-weight:720;color:#fff}
.mnav a.m small{font-size:13px;font-weight:500;color:var(--w-muted)}
.mnav .btns{display:grid;gap:10px;margin-top:22px}

/* 구간 */
.sec{padding-block:clamp(76px,9vw,136px);overflow-x:clip}
.sec.tight{padding-block:clamp(56px,6vw,88px)}
.mist{background:var(--mist)}
.cloud{background:var(--cloud)}
.dark{background:var(--navy);color:#cbd5e1}
.dark h1,.dark h2,.dark h3{color:#fff}
.kick{display:block;margin-bottom:16px;font-size:15px;font-weight:760;color:var(--blue)}
.dark .kick{color:var(--sky)}
.h2{font-size:clamp(31px,4.1vw,54px);font-weight:820;line-height:1.2;letter-spacing:-.034em}
.h2 em{font-style:normal;color:var(--blue)}
.dark .h2 em{color:var(--sky)}
.lead{margin-top:20px;font-size:clamp(17px,1.6vw,20px);line-height:1.7;color:var(--muted)}
.dark .lead{color:#b8c3d4}
.sec-h{max-width:780px;margin-bottom:clamp(36px,4.5vw,60px)}
.sec-h.c{margin-inline:auto;text-align:center}
.note{font-size:14px;color:var(--soft);line-height:1.6}
.dark .note{color:#8f9cb1}
.law{display:inline-block;font-size:13px;font-weight:650;color:var(--soft);letter-spacing:-.01em}
.dark .law{color:#8f9cb1}

/* 첫 화면 */
.hero{position:relative;overflow:hidden;background:radial-gradient(1200px 620px at 78% 30%,#1b2b4d 0%,rgba(19,33,61,0) 62%),var(--navy);color:#cbd5e1}
.hero-in{display:grid;gap:44px;padding-block:clamp(40px,6vw,86px) clamp(56px,7vw,100px)}
@media(min-width:1024px){.hero-in{grid-template-columns:minmax(0,1.04fr) minmax(0,.96fr);align-items:center;gap:30px}}
.eyebrow{display:inline-flex;align-items:center;gap:8px;margin-bottom:20px;font-size:15px;font-weight:720;color:var(--sky)}
.eyebrow i{width:8px;height:8px;border-radius:50%;background:var(--urgent-2);box-shadow:0 0 0 0 rgba(234,88,12,.6);animation:pulse 2s infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(234,88,12,.55)}70%{box-shadow:0 0 0 10px rgba(234,88,12,0)}100%{box-shadow:0 0 0 0 rgba(234,88,12,0)}}
.hero h1{font-size:clamp(40px,5.5vw,78px);font-weight:840;line-height:1.14;letter-spacing:-.04em;color:#fff}
.hero h1 .rot{position:relative;display:block;height:1.16em;overflow:hidden}
.hero h1 .rot span{position:absolute;left:0;top:0;white-space:nowrap;transition:transform .55s cubic-bezier(.2,.8,.2,1),opacity .55s}
.hero h1 .rot span.out{transform:translateY(-105%);opacity:0}
.hero h1 .rot span.wait{transform:translateY(105%);opacity:0}
.hero h1 .hl{display:inline-block;margin-top:.2em;padding:.04em .18em .08em;background:#fff;color:var(--navy);line-height:1.1;font-size:.64em;letter-spacing:-.035em}
.hero .sub{margin-top:28px;font-size:clamp(18px,1.7vw,22px);font-weight:720;color:#fff;line-height:1.5}
.hero .sub u{text-decoration:underline;text-decoration-color:var(--urgent-2);text-decoration-thickness:3px;text-underline-offset:7px;color:var(--orange)}
.hero .lead{margin-top:14px;color:#b8c3d4}
.price-strip{display:flex;flex-wrap:wrap;gap:8px 10px;margin-top:26px}
.price-strip span{display:inline-flex;align-items:baseline;gap:8px;padding:9px 15px;border-radius:12px;background:var(--w-tint);font-size:15px;color:#dbe3ef}
.price-strip b{font-size:19px;font-weight:820;color:#fff;letter-spacing:-.02em}
.price-strip small{font-size:12.5px;color:var(--w-muted)}
.cta-row{display:flex;flex-wrap:wrap;gap:12px;margin-top:30px}
.micro{margin-top:16px;font-size:14px;line-height:1.6;color:#94a3b8}
.micro .dot{display:inline-block;width:7px;height:7px;margin-right:7px;border-radius:50%;background:#facc15;vertical-align:1px}
@media(max-width:600px){.cta-row .btn{width:100%}}

/* 첫 화면 장면: AI 말풍선 + 서면 + 변호사 */
.stage{position:relative;min-height:0;max-width:620px}
.stage .kang{display:none}
.stage-glow{display:none}
@media(min-width:1280px){
  .stage{min-height:640px;max-width:none}
  .stage .kang{display:block;position:absolute;z-index:1;right:-160px;top:40px;width:440px;filter:drop-shadow(0 30px 60px rgba(0,0,0,.35))}
  .stage-glow{display:block;position:absolute;z-index:0;right:-170px;top:60px;width:520px;height:520px;border-radius:50%;background:radial-gradient(closest-side,rgba(96,140,255,.34),rgba(96,140,255,0))}
}
.ai-bub{position:relative;z-index:3;display:flex;gap:12px;max-width:390px;padding:14px 16px;border-radius:18px 18px 18px 6px;background:rgba(255,255,255,.09);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);color:#e2e8f0;font-size:15px;line-height:1.55;box-shadow:0 18px 40px rgba(0,0,0,.25)}
.ai-bub .av{flex:none;display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:linear-gradient(135deg,#6d7cff,#22d3ee);color:#fff}
.ai-bub .av svg{width:19px;height:19px}
.ai-bub b{display:block;font-size:12.5px;color:#9fb0c9;font-weight:650;margin-bottom:2px}
.ai-bub .claim{position:relative;display:inline}
.ai-bub .typing i{display:inline-block;width:6px;height:6px;margin-right:4px;border-radius:50%;background:#cbd5e1;animation:blink 1s infinite}
.ai-bub .typing i:nth-child(2){animation-delay:.15s}.ai-bub .typing i:nth-child(3){animation-delay:.3s}
@keyframes blink{0%,100%{opacity:.25}50%{opacity:1}}
.stage .ai-bub{margin:0}
@media(min-width:1024px){.stage .ai-bub{margin:0 0 0 -10px}}
.doc-wrap{position:relative;z-index:2;width:min(100%,470px)}
@media(min-width:1024px){.doc-wrap{transform:rotate(-1.6deg);margin-top:4px}}
@media(min-width:1280px){.doc-wrap{width:440px}.stage .doc{font-size:13.5px;line-height:1.8;padding:26px 132px 28px 26px}}
.count{position:absolute;z-index:5;top:-16px;right:-12px;display:flex;align-items:center;gap:8px;padding:9px 14px 9px 10px;border-radius:999px;background:var(--urgent);color:#fff;font-size:14px;font-weight:760;box-shadow:0 14px 30px rgba(194,65,12,.4);transform:scale(.6);opacity:0;transition:transform .45s cubic-bezier(.3,1.6,.5,1),opacity .3s}
.count.on{transform:none;opacity:1}
.count .n{display:inline-grid;place-items:center;min-width:26px;height:26px;border-radius:50%;background:#fff;color:var(--urgent);font-size:15px;font-weight:850}
.stamp{position:absolute;z-index:6;right:18px;bottom:22px;display:grid;place-items:center;width:112px;height:112px;border-radius:50%;color:var(--pen);font-weight:850;font-size:17px;line-height:1.15;text-align:center;letter-spacing:-.02em;box-shadow:inset 0 0 0 3px var(--pen),inset 0 0 0 7px var(--doc),inset 0 0 0 8.5px var(--pen);transform:rotate(-14deg) scale(1.9);opacity:0;pointer-events:none;mix-blend-mode:multiply}
.stamp small{display:block;font-size:11px;font-weight:700;letter-spacing:.02em}
.stamp.on{animation:thump .42s cubic-bezier(.3,1.4,.5,1) forwards}
@keyframes thump{0%{transform:rotate(-14deg) scale(1.9);opacity:0}60%{opacity:.95}100%{transform:rotate(-14deg) scale(1);opacity:.9}}
.stage-cap{position:relative;z-index:3;margin-top:14px;font-size:12.5px;color:#8392a8}
.who-card{display:none}
@media(min-width:1280px){.who-card{display:block;position:absolute;z-index:4;right:-60px;top:470px;padding:12px 16px;border-radius:14px;background:rgba(15,23,42,.84);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);box-shadow:0 18px 40px rgba(0,0,0,.3)}}
.who-card b{display:block;color:#fff;font-size:16px}
.who-card span{display:block;font-size:12.5px;color:#a7b3c6}

/* 서면(종이) — 작성 예시 */
.doc{position:relative;background:var(--doc);color:var(--doc-ink);border-radius:6px;padding:30px 30px 34px;font-family:"HN Doc","Nanum Myeongjo","AppleMyungjo",serif;font-size:14.5px;line-height:1.85;box-shadow:0 2px 0 rgba(0,0,0,.04),var(--shadow);word-break:keep-all}
.doc.m{padding-right:150px}
@media(max-width:640px){.doc{padding:22px 18px 26px;font-size:13.5px}.doc.m{padding-right:18px}}
.doc .t{margin-bottom:14px;text-align:center;font-weight:700;font-size:19px;letter-spacing:.55em;text-indent:.55em}
.doc .meta{display:grid;grid-template-columns:auto 1fr;gap:0 14px;margin-bottom:14px;font-size:13.5px}
.doc .meta dt{letter-spacing:.3em}
.doc h4{margin:14px 0 4px;font-size:14.5px;font-weight:700}
.doc p{margin:0}
.doc ol{counter-reset:p}
.doc ol>li{position:relative;padding-left:1.5em;counter-increment:p}
.doc ol>li::before{content:counter(p) ".";position:absolute;left:0}
.doc .sign{margin-top:16px;text-align:right;font-size:13.5px}
.doc .court{margin-top:6px;text-align:center;font-weight:700;letter-spacing:.3em}
.doc mark{background:none;color:inherit}
.doc .ins{color:var(--green);font-weight:700}
.doc .gone{text-decoration:line-through;text-decoration-thickness:1.5px}
.doc-tag{position:absolute;top:12px;left:14px;padding:3px 9px;border-radius:999px;background:var(--tint);font-family:Pretendard,sans-serif;font-size:11.5px;font-weight:700;color:var(--soft);letter-spacing:0}
.ink{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}
.ink path{fill:none;stroke:var(--pen);stroke-width:2.3;stroke-linecap:round;stroke-linejoin:round}
.ink .num{fill:var(--pen);font-family:"HN Pen",cursive;font-size:22px}
.pen{font-family:"HN Pen","Nanum Pen Script",cursive;color:var(--pen);font-weight:400;line-height:1.05;letter-spacing:0}
.notes{margin-top:14px;display:grid;gap:4px}
.notes li{font-family:"HN Pen","Nanum Pen Script",cursive;color:var(--pen);font-size:22px;line-height:1.15}
.js .doc.wide .notes{position:absolute;inset:0;margin:0;display:block;pointer-events:none}
.js .doc.wide .notes li{position:absolute;right:10px;width:118px;font-size:22px;transform:rotate(-3deg) translateX(8px);opacity:0;transition:opacity .35s,transform .45s cubic-bezier(.2,.9,.3,1.3)}
.js .doc.wide .notes li.on{opacity:1;transform:rotate(-3deg)}
.js .doc:not(.wide) .notes li{opacity:0;transition:opacity .35s}
.js .doc:not(.wide) .notes li.on{opacity:1}
.doc.m:not(.wide){padding-right:30px}
@media(max-width:640px){.doc.m:not(.wide){padding-right:18px}}
.notes li .k{display:inline-grid;place-items:center;width:1.05em;height:1.05em;margin-right:.2em;border-radius:50%;box-shadow:inset 0 0 0 1.5px var(--pen);font-size:.8em}

/* 서류 고르기 */
.pick{display:grid;gap:22px}
@media(min-width:960px){.pick{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:28px;align-items:start}}
.pick-list{display:grid;gap:6px}
.pick-list button{display:flex;align-items:center;justify-content:space-between;gap:14px;width:100%;padding:17px 20px;border:0;border-radius:16px;background:var(--tint);text-align:left;font-size:17px;font-weight:700;color:var(--ink);cursor:pointer;transition:background .2s,color .2s,transform .2s}
.pick-list button:hover{background:var(--tint-2)}
.pick-list button[aria-selected=true]{background:var(--navy);color:#fff;transform:translateX(4px)}
.pick-list button small{flex:none;padding:4px 10px;border-radius:999px;background:var(--urgent-l);color:var(--urgent);font-size:13px;font-weight:760}
.pick-list button[aria-selected=true] small{background:var(--urgent);color:#fff}
.pick-list .bar{position:relative;display:block;height:3px;margin-top:-6px;border-radius:3px;overflow:hidden}
.pick-panel{position:relative;padding:clamp(26px,3.4vw,42px);border-radius:var(--r);background:var(--paper);box-shadow:var(--shadow-s)}
@media(min-width:960px){.pick-panel{position:sticky;top:calc(var(--hd) + 24px)}}
.pick-panel .big{display:flex;align-items:baseline;flex-wrap:wrap;gap:6px 14px}
.pick-panel .big b{font-size:clamp(56px,7vw,92px);font-weight:860;letter-spacing:-.05em;line-height:1;color:var(--urgent)}
.pick-panel .big span{font-size:17px;font-weight:720;color:var(--ink)}
.pick-panel h3{margin-top:22px;font-size:clamp(22px,2.2vw,28px);font-weight:800;letter-spacing:-.025em}
.pick-panel .body{margin-top:12px;color:var(--muted)}
.pick-panel .chk{margin-top:20px;padding:16px 18px;border-radius:14px;background:var(--mist)}
.pick-panel .chk b{display:block;margin-bottom:4px;font-size:14px;color:var(--ink)}
.pick-panel .chk p{font-size:15px;color:var(--muted)}
.pick-panel .acts{display:flex;flex-wrap:wrap;gap:10px;margin-top:24px}
.pick-panel .acts .btn{min-height:50px;padding:12px 22px;font-size:15.5px}
.fade-swap{animation:swap .45s ease}
@keyframes swap{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

/* 전후 비교: 넓은 화면은 나란히, 좁은 화면은 탭으로 */
.duo{max-width:1120px;margin-inline:auto}
.duo-tabs{display:flex;width:fit-content;margin:0 auto 18px}
.duo-grid{display:grid;gap:18px}
.duo-col{position:relative}
.duo-col .doc{box-shadow:var(--shadow-s);height:100%}
.lab{display:inline-block;margin-bottom:10px;padding:6px 12px;border-radius:999px;font-size:13.5px;font-weight:780}
.lab.l{background:var(--pen-l);color:var(--pen)}
.lab.r{background:var(--green-l);color:var(--green)}
.duo-mid{display:none}
@media(max-width:959px){.duo[data-show=before] .after,.duo[data-show=after] .before{display:none}}
@media(min-width:960px){
  .duo-tabs{display:none}
  .duo-grid{grid-template-columns:minmax(0,1fr) 74px minmax(0,1fr);gap:0;align-items:stretch}
  .duo-col{display:flex;flex-direction:column}
  .duo-mid{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;font-size:13px;font-weight:780;line-height:1.35;text-align:center;color:var(--navy)}
  .duo-mid svg{width:30px;height:30px;color:var(--green)}
}
.doc .ins{background-image:linear-gradient(rgba(4,120,87,.13),rgba(4,120,87,.13));background-repeat:no-repeat;background-size:0 100%;transition:background-size .7s ease}
.doc .ins.on,.no-js .doc .ins{background-size:100% 100%}
.doc .gone{text-decoration-color:transparent;transition:text-decoration-color .4s,color .4s}
.doc .gone.on,.no-js .doc .gone{text-decoration-color:var(--pen);color:#9aa3ad}
.ba-hint{margin-top:18px;text-align:center;font-size:14px;color:var(--soft)}
.fixes{display:grid;gap:14px;margin-top:clamp(36px,4vw,56px)}
@media(min-width:900px){.fixes{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}}
.fix{position:relative;padding:24px 24px 22px 70px;border-radius:var(--r);background:var(--paper)}
.fix .k{position:absolute;left:22px;top:22px;display:grid;place-items:center;width:34px;height:34px;border-radius:50%;box-shadow:inset 0 0 0 2px var(--pen);font-family:"HN Pen",cursive;font-size:24px;color:var(--pen)}
.fix h3{font-size:19px;font-weight:780;letter-spacing:-.02em}
.fix h3 s{color:var(--pen);text-decoration-thickness:2px}
.fix h3 .to{color:var(--green)}
.fix p{margin-top:8px;font-size:15.5px;color:var(--muted)}
.fix .law{margin-top:10px}

/* 두 갈래 */
.fork{display:grid;gap:16px;margin-top:clamp(40px,5vw,64px)}
@media(min-width:900px){.fork{grid-template-columns:1fr 1fr;gap:20px}}
.fork .side{padding:clamp(24px,3vw,34px);border-radius:var(--r)}
.fork .bad{background:#fff4ef}
.fork .good{background:#ecfdf5}
.fork h3{font-size:clamp(19px,1.8vw,22px);font-weight:800}
.fork .bad h3{color:var(--urgent)}
.fork .good h3{color:var(--green)}
.fork ol{display:grid;gap:12px;margin-top:18px}
.fork li{position:relative;padding-left:22px;font-size:16px;color:var(--text)}
.fork li::before{content:"";position:absolute;left:3px;top:.62em;width:9px;height:9px;border-radius:50%;background:currentColor;opacity:.5}
.fork .bad li::before{color:var(--urgent)}
.fork .good li::before{color:var(--green)}
.fork q{font-weight:720;color:var(--urgent)}
.fork-cap{margin-top:14px;text-align:center}

/* AI 채점 */
.tabs{display:inline-flex;flex-wrap:wrap;gap:6px;padding:6px;border-radius:16px;background:var(--tint)}
.dark .tabs{background:var(--w-tint)}
.tabs button{padding:10px 18px;border:0;border-radius:11px;background:none;font-size:15.5px;font-weight:720;color:var(--muted);cursor:pointer}
.dark .tabs button{color:#b8c3d4}
.tabs button[aria-selected=true]{background:var(--paper);color:var(--ink);box-shadow:0 4px 14px rgba(15,23,42,.1)}
.grade{display:grid;gap:26px;margin-top:28px}
@media(min-width:1000px){.grade{grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);gap:34px;align-items:start}}
.chat{padding:clamp(18px,2.6vw,30px);border-radius:var(--r);background:var(--navy-3)}
.q{margin-left:auto;max-width:86%;width:fit-content;padding:13px 17px;border-radius:18px 18px 6px 18px;background:var(--blue);color:#fff;font-size:15.5px;line-height:1.55}
.a{margin-top:16px;display:grid;gap:10px}
.a .who{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:700;color:#9fb0c9}
.a .who .av{display:grid;place-items:center;width:26px;height:26px;border-radius:8px;background:linear-gradient(135deg,#6d7cff,#22d3ee);color:#fff}
.a .who .av svg{width:15px;height:15px}
.sent{position:relative;padding:13px 16px;border-radius:16px;background:var(--w-tint);color:#e2e8f0;font-size:15.5px;line-height:1.6;transition:background .3s}
.sent .v{display:inline-flex;align-items:center;gap:5px;margin-left:6px;padding:2px 9px;border-radius:999px;font-size:12.5px;font-weight:780;vertical-align:2px;opacity:0;transform:scale(.6);transition:opacity .25s,transform .35s cubic-bezier(.3,1.6,.5,1)}
.sent .fixln{display:block;max-height:0;overflow:hidden;opacity:0;transition:max-height .5s ease,opacity .4s,margin .4s;font-family:"HN Pen",cursive;font-size:22px;line-height:1.2;color:#ffb39c}
.sent .fixln .law{font-family:Pretendard,sans-serif;font-size:12.5px;color:#8f9cb1;margin-left:4px}
.sent.on .v{opacity:1;transform:none}
.sent.on .fixln{max-height:160px;opacity:1;margin-top:6px}
.sent.ok .v{background:rgba(16,185,129,.18);color:#6ee7b7}
.sent.no .v{background:rgba(210,58,28,.22);color:#ffb39c}
.sent.new .v{background:rgba(234,88,12,.22);color:#fdba74}
.sent.risk .v{background:rgba(210,58,28,.22);color:#ffb39c}
.sent.on.no,.sent.on.new,.sent.on.risk{background:rgba(210,58,28,.10)}
.sent.no .tx,.sent.new .tx,.sent.risk .tx{text-decoration:line-through;text-decoration-color:transparent;transition:text-decoration-color .4s}
.sent.on.no .tx,.sent.on.new .tx,.sent.on.risk .tx{text-decoration-color:rgba(255,120,90,.85)}
.tally{padding:clamp(22px,2.6vw,30px);border-radius:var(--r);background:var(--w-tint)}
.tally .big{font-size:clamp(46px,5vw,64px);font-weight:860;letter-spacing:-.05em;line-height:1;color:#fff}
.tally .big small{font-size:.42em;font-weight:720;color:#b8c3d4;letter-spacing:-.02em}
.tally p{margin-top:12px;color:#b8c3d4}
.tally ul{display:grid;gap:8px;margin-top:18px}
.tally li{display:flex;justify-content:space-between;gap:10px;padding:10px 14px;border-radius:12px;background:rgba(255,255,255,.05);font-size:15px}
.tally li b{color:#fff}
.legend{display:flex;flex-wrap:wrap;gap:8px 14px;margin-top:16px;font-size:13px;color:#8f9cb1}
.legend span{display:inline-flex;align-items:center;gap:6px}
.legend i{width:10px;height:10px;border-radius:50%}

/* 계산기 */
.calc{display:grid;gap:28px;padding:clamp(24px,3.4vw,44px);border-radius:28px;background:var(--paper);box-shadow:var(--shadow-s)}
@media(min-width:960px){.calc{grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:44px;align-items:center}}
.calc label{display:block;font-size:15px;font-weight:720;color:var(--muted)}
.calc .amt{display:block;margin-top:6px;font-size:clamp(40px,4.6vw,60px);font-weight:860;letter-spacing:-.045em;color:var(--ink);line-height:1.1}
.calc input[type=range]{width:100%;margin-top:22px;accent-color:var(--blue);height:34px}
.calc .ticks{display:flex;justify-content:space-between;font-size:12.5px;color:var(--soft)}
.calc .presets{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}
.calc .presets button{padding:8px 14px;border:0;border-radius:999px;background:var(--tint);font-size:14px;font-weight:700;color:var(--text);cursor:pointer}
.calc .presets button:hover{background:var(--tint-2)}
.rows{display:grid;gap:18px}
.row .lab{display:flex;justify-content:space-between;gap:12px;font-size:15px;color:var(--muted)}
.row .lab b{font-size:clamp(20px,2vw,26px);font-weight:840;letter-spacing:-.03em;color:var(--ink);white-space:nowrap}
.row .track{height:16px;margin-top:8px;border-radius:999px;background:var(--tint);overflow:hidden}
.row .fill{height:100%;width:0;border-radius:999px;transition:width .7s cubic-bezier(.2,.8,.2,1)}
.row.r1 .fill{background:var(--urgent)}
.row.r2 .fill{background:#f59e0b}
.row.r3 .fill{background:var(--blue);min-width:6px}
.row.r3 .lab b{color:var(--blue)}
.ratio{margin-top:6px;font-size:14.5px;color:var(--muted)}
.ratio b{color:var(--ink)}

/* 변호사 */
.lawyer{position:relative;overflow:hidden}
.lawyer-grid{display:grid;gap:40px}
@media(min-width:1024px){.lawyer-grid{grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);gap:56px;align-items:center}}
.portrait{position:relative;max-width:460px}
.portrait::before{content:"";position:absolute;inset:14% -8% 0;border-radius:40% 40% 24px 24px;background:radial-gradient(closest-side,rgba(96,140,255,.35),rgba(96,140,255,0) 75%)}
.portrait img{position:relative;width:100%}
.portrait .plate{position:absolute;left:0;bottom:18px;padding:14px 18px;border-radius:14px;background:rgba(15,23,42,.86);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.portrait .plate b{display:block;font-size:22px;color:#fff;letter-spacing:-.02em}
.portrait .plate span{font-size:13.5px;color:#a7b3c6}
.name-xl{font-size:clamp(54px,8vw,112px);font-weight:880;letter-spacing:-.055em;line-height:1;color:#fff}
.name-xl small{display:block;margin-top:12px;font-size:clamp(17px,1.7vw,21px);font-weight:700;letter-spacing:-.02em;color:var(--sky)}
.creds{display:grid;gap:26px 34px;margin-top:38px}
@media(min-width:700px){.creds{grid-template-columns:1fr 1fr}}
.creds h3{margin-bottom:10px;font-size:14px;font-weight:760;color:var(--sky);letter-spacing:0}
.creds li{padding:5px 0;font-size:16.5px;color:#e2e8f0;line-height:1.5}
.creds li.big{font-size:clamp(19px,1.9vw,23px);font-weight:780;color:#fff;letter-spacing:-.02em}
.media{display:grid;gap:14px;margin-top:clamp(44px,5vw,70px)}
@media(min-width:800px){.media{grid-template-columns:1.25fr 1fr 1fr}}
.media figure{position:relative;overflow:hidden;border-radius:16px;background:var(--navy-3)}
.media img{width:100%;height:100%;object-fit:cover;aspect-ratio:16/10}
.media figcaption{position:absolute;left:0;right:0;bottom:0;padding:30px 16px 13px;background:linear-gradient(transparent,rgba(2,6,23,.85));font-size:13.5px;color:#cbd5e1}
.media figcaption b{display:block;color:#fff;font-size:15px}
.outlets{position:relative;margin-top:clamp(40px,5vw,64px);overflow:hidden;mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 8%,#000 92%,transparent)}
.outlets .track{display:flex;gap:44px;width:max-content;animation:marquee 38s linear infinite}
.outlets:hover .track{animation-play-state:paused}
.outlets a{font-size:clamp(20px,2.2vw,28px);font-weight:820;letter-spacing:-.03em;color:#64748b;white-space:nowrap;transition:color .2s}
.outlets a:hover{color:#fff}
@keyframes marquee{to{transform:translateX(-50%)}}
.quotes{position:relative;margin-top:clamp(40px,5vw,64px);padding:clamp(26px,3.6vw,48px);border-radius:24px;background:var(--w-tint)}
.quotes .lead-in{font-size:16px;color:#b8c3d4;max-width:640px}
.quotes .lead-in b{color:#fff}
.qslide{display:grid;margin-top:22px}
.qslide blockquote{grid-area:1/1;opacity:0;transform:translateY(10px);transition:opacity .6s,transform .6s}
.no-js .qslide blockquote:first-child{opacity:1;transform:none}
.qslide blockquote.on{opacity:1;transform:none}
.qslide p{font-size:clamp(21px,2.3vw,30px);font-weight:760;line-height:1.45;color:#fff;letter-spacing:-.025em}
.qslide p mark{background:linear-gradient(transparent 62%,rgba(234,88,12,.55) 62%);color:#fff}
.qslide cite{display:block;margin-top:14px;font-style:normal;font-size:14px;color:#94a3b8}
.qslide cite a{color:#cbd5e1;text-decoration:underline;text-underline-offset:3px}
.qdots{display:flex;gap:8px;margin-top:18px}
.qdots button{width:28px;height:5px;padding:0;border:0;border-radius:5px;background:rgba(255,255,255,.2);cursor:pointer}
.qdots button[aria-current=true]{background:var(--urgent-2)}
.signline{display:flex;align-items:center;gap:14px;margin-top:34px;padding:16px 20px;border-radius:16px;background:rgba(255,255,255,.05);font-size:15.5px;color:#cbd5e1}
.signline .pen{font-size:34px;color:#ff9b80;white-space:nowrap}

/* 검토지 */
.sheets{position:relative;display:grid;gap:30px}
@media(min-width:1000px){.sheets{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:50px;align-items:center}}
.fan{position:relative;height:clamp(380px,46vw,520px)}
.fan .pg{position:absolute;left:50%;top:50%;width:min(76%,350px);aspect-ratio:1/1.414;margin:0;padding:22px 20px;border-radius:6px;background:var(--doc);box-shadow:0 22px 50px rgba(15,23,42,.18);font-size:11px;line-height:1.6;color:#4b5563;transition:transform .6s cubic-bezier(.2,.8,.2,1),box-shadow .4s,z-index 0s .2s;cursor:pointer;overflow:hidden}
.fan .pg h4{font-size:14px;font-weight:800;color:var(--ink);margin-bottom:8px}
.fan .pg .tab{position:absolute;top:0;right:16px;padding:5px 10px 6px;border-radius:0 0 8px 8px;font-size:11px;font-weight:760;color:#fff}
.fan .pg:nth-child(1){transform:translate(-50%,-50%) translate(-22%,-6%) rotate(-9deg);z-index:1}
.fan .pg:nth-child(2){transform:translate(-50%,-50%) translate(-8%,-2%) rotate(-3deg);z-index:2}
.fan .pg:nth-child(3){transform:translate(-50%,-50%) translate(8%,2%) rotate(3deg);z-index:3}
.fan .pg:nth-child(4){transform:translate(-50%,-50%) translate(22%,6%) rotate(9deg);z-index:4}
@media(min-width:700px){
  .fan .pg:nth-child(1){transform:translate(-50%,-50%) translate(-34%,-6%) rotate(-9deg)}
  .fan .pg:nth-child(2){transform:translate(-50%,-50%) translate(-12%,-2%) rotate(-3deg)}
  .fan .pg:nth-child(3){transform:translate(-50%,-50%) translate(12%,2%) rotate(3deg)}
  .fan .pg:nth-child(4){transform:translate(-50%,-50%) translate(34%,6%) rotate(9deg)}
}
@media(max-width:699px){.fan .pg{width:min(64%,300px)}}
.fan .pg.front{z-index:10!important;transform:translate(-50%,-50%) scale(1.06) rotate(0)!important;box-shadow:0 34px 70px rgba(15,23,42,.28)}
.pg .l{height:6px;margin:6px 0;border-radius:3px;background:#e5e7eb}
.pg .l.s{width:62%}.pg .l.m{width:84%}
.pg .rd{background:rgba(210,58,28,.35)}
.pg .gr{background:rgba(4,120,87,.35)}
.pg .verdict{display:inline-block;margin:6px 0 10px;padding:4px 9px;border-radius:6px;background:var(--urgent-l);color:var(--urgent);font-weight:800;font-size:12px}
.pg .penmark{font-family:"HN Pen",cursive;color:var(--pen);font-size:18px;line-height:1.1}
.pg .row2{display:flex;justify-content:space-between;padding:5px 0;font-size:11.5px}
.pg .row2 b{color:var(--ink)}
.sheet-list{display:grid;gap:8px}
.sheet-list button{display:block;width:100%;padding:18px 20px;border:0;border-radius:16px;background:var(--tint);text-align:left;cursor:pointer;transition:background .25s}
.sheet-list button[aria-current=true]{background:var(--navy)}
.sheet-list b{display:block;font-size:18px;font-weight:780;color:var(--ink)}
.sheet-list span{display:block;margin-top:4px;font-size:15px;color:var(--muted)}
.sheet-list button[aria-current=true] b{color:#fff}
.sheet-list button[aria-current=true] span{color:#b8c3d4}

/* 가격 */
.prices{display:grid;gap:16px}
@media(min-width:960px){.prices{grid-template-columns:1fr 1.18fr 1fr;align-items:stretch;gap:18px}}
.price{display:flex;flex-direction:column;padding:clamp(26px,3vw,36px);border-radius:24px;background:var(--paper);box-shadow:var(--shadow-s)}
.price.main{background:var(--navy);color:#cbd5e1;box-shadow:0 30px 70px rgba(15,23,42,.3)}
@media(min-width:960px){.price.main{transform:translateY(-14px)}}
.price .tag{align-self:flex-start;padding:5px 11px;border-radius:999px;background:var(--blue-l);color:var(--blue-d);font-size:13px;font-weight:760}
.price.main .tag{background:var(--blue);color:#fff}
.price h3{margin-top:16px;font-size:22px;font-weight:800;letter-spacing:-.02em}
.price.main h3{color:#fff}
.price .for{margin-top:4px;font-size:15px;color:var(--muted)}
.price.main .for{color:#a7b3c6}
.price .amt{margin-top:18px;font-size:clamp(38px,4vw,50px);font-weight:860;letter-spacing:-.045em;line-height:1;color:var(--ink)}
.price.main .amt{color:#fff}
.price .amt small{font-size:16px;font-weight:700;letter-spacing:-.01em;color:var(--soft);margin-left:4px}
.price.main .amt small{color:#a7b3c6}
.price ul{display:grid;gap:9px;margin:22px 0 26px}
.price li{position:relative;padding-left:18px;font-size:15.5px;line-height:1.5}
.price li::before{content:"";position:absolute;left:2px;top:.6em;width:7px;height:7px;border-radius:2px;background:var(--blue)}
.price.main li::before{background:var(--sky)}
.price .when{margin-top:auto;padding:12px 14px;border-radius:12px;background:var(--mist);font-size:14.5px;font-weight:700;color:var(--ink)}
.price.main .when{background:var(--w-tint);color:#fff}
.price .when small{display:block;font-weight:500;color:var(--soft);font-size:13px}
.price.main .when small{color:#a7b3c6}
.price .btn{margin-top:16px}
.price-notes{display:grid;gap:6px;margin-top:26px}
.price-notes p{font-size:14.5px;color:var(--muted)}

/* 진행 */
.flow{position:relative;display:grid;gap:14px}
@media(min-width:960px){.flow{grid-template-columns:repeat(4,1fr);gap:18px}}
.flow li{position:relative;padding:26px 22px 24px;border-radius:20px;background:var(--paper)}
.flow .when{display:inline-block;padding:4px 10px;border-radius:999px;background:var(--blue-l);color:var(--blue-d);font-size:13px;font-weight:760}
.flow li:last-child .when{background:var(--green-l);color:var(--green)}
.flow h3{margin-top:14px;font-size:19px;font-weight:800;letter-spacing:-.02em}
.flow p{margin-top:8px;font-size:15px;color:var(--muted)}
.flow .prog{position:absolute;left:22px;right:22px;bottom:0;height:4px;border-radius:4px;background:var(--tint);overflow:hidden}
.flow .prog i{display:block;height:100%;width:0;background:var(--blue);transition:width 1.1s ease}
.flow li.in .prog i{width:100%}

/* 기한 계산 */
.dl{display:grid;gap:22px;padding:clamp(24px,3.4vw,40px);border-radius:28px;background:var(--navy);color:#cbd5e1}
@media(min-width:960px){.dl{grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:40px;align-items:center}}
.dl label{display:block;margin-bottom:8px;font-size:14.5px;font-weight:720;color:#cbd5e1}
.field{width:100%;min-height:54px;padding:13px 16px;border:0;border-radius:14px;background:var(--w-tint-2);color:#fff;font-size:16px}
.field option{color:var(--ink)}
.dl .f+.f{margin-top:16px}
.dl-out{padding:clamp(22px,3vw,32px);border-radius:22px;background:var(--paper);color:var(--text)}
.dl-out .k{font-size:14.5px;font-weight:720;color:var(--muted)}
.dl-out .date{margin-top:6px;font-size:clamp(30px,3.6vw,44px);font-weight:860;letter-spacing:-.04em;color:var(--ink);line-height:1.15}
.dl-out .dd{display:inline-block;margin-top:12px;padding:6px 14px;border-radius:999px;background:var(--blue-l);color:var(--blue-d);font-size:16px;font-weight:820}
.dl-out.hot .dd{background:var(--urgent);color:#fff;animation:pulse 2s infinite}
.dl-out.gone .dd{background:#1f2937;color:#fff}
.dl-out p{margin-top:14px;font-size:15px;color:var(--muted)}
.dl-out .law{margin-top:8px}
.dl-out .warn{display:none;margin-top:16px;padding:14px 16px;border-radius:14px;background:var(--urgent-l);color:var(--urgent);font-weight:720;font-size:15px}
.dl-out.hot .warn,.dl-out.gone .warn{display:block}

/* 자주 묻는 질문 */
.faq{display:grid;gap:10px;max-width:880px}
.faq details{border-radius:16px;background:var(--tint)}
.faq summary{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:20px 22px;font-size:17px;font-weight:740;color:var(--ink);cursor:pointer;list-style:none}
.faq summary::-webkit-details-marker{display:none}
.faq summary i{flex:none;display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--paper);transition:transform .25s}
.faq summary i svg{width:16px;height:16px}
.faq details[open] summary i{transform:rotate(45deg)}
.faq .ans{padding:0 22px 22px;color:var(--muted)}
.faq .ans p+p{margin-top:8px}

/* 신청 */
.apply{display:grid;gap:26px}
@media(min-width:1000px){.apply{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:44px;align-items:start}}
.ways{display:grid;gap:12px;margin-top:30px}
.way{display:flex;align-items:center;gap:16px;padding:20px 22px;border-radius:20px;background:var(--w-tint);color:#fff;transition:background .2s}
.way:hover{background:var(--w-tint-2)}
.way .ic{flex:none;display:grid;place-items:center;width:50px;height:50px;border-radius:15px;background:var(--kakao);color:#191600}
.way .ic svg{width:26px;height:26px}
.way.tel .ic{background:var(--blue);color:#fff}
.way b{display:block;font-size:18px;font-weight:800}
.way small{display:block;font-size:14px;color:#a7b3c6}
.way .chev{margin-left:auto;width:20px;height:20px;color:#94a3b8}
.form{padding:clamp(24px,3vw,36px);border-radius:26px;background:var(--paper);color:var(--text);box-shadow:var(--shadow)}
.form h3{font-size:22px;font-weight:820;letter-spacing:-.02em;color:var(--ink)}
.form .sub{margin-top:6px;font-size:15px;color:var(--muted)}
.form .grid{display:grid;gap:14px;margin-top:22px}
@media(min-width:560px){.form .two{display:grid;grid-template-columns:1fr 1fr;gap:14px}}
.form label{display:block;margin-bottom:6px;font-size:14px;font-weight:720;color:var(--ink)}
.form .in{width:100%;min-height:52px;padding:13px 15px;border:0;border-radius:13px;background:var(--tint);font-size:16px;color:var(--ink)}
.form .in:focus{outline:2px solid var(--blue);outline-offset:0;background:#fff}
.form textarea.in{min-height:120px;resize:vertical;line-height:1.6}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chips label{margin:0}
.chips input{position:absolute;opacity:0;pointer-events:none}
.chips span{display:inline-block;padding:10px 15px;border-radius:999px;background:var(--tint);font-size:14.5px;font-weight:700;color:var(--text);cursor:pointer;transition:background .2s,color .2s}
.chips input:checked+span{background:var(--navy);color:#fff}
.chips input:focus-visible+span{outline:3px solid #93b4ff;outline-offset:2px}
.chips input[value=d3]:checked+span{background:var(--urgent)}
.agree{display:flex;gap:10px;align-items:flex-start;font-size:14px;color:var(--muted);font-weight:500!important}
.agree input{width:20px;height:20px;margin-top:2px;accent-color:var(--blue)}
.agree a{text-decoration:underline}
.hp{position:absolute!important;left:-9999px!important}
.form .btn{width:100%;margin-top:6px}
.form .msg{min-height:22px;margin-top:10px;font-size:14.5px;font-weight:700;color:var(--urgent)}
.form .done{padding:10px 0}
.form .done h3{color:var(--green)}
.form .done p{margin-top:8px;color:var(--muted)}

/* 바닥글 */
.ft{background:#0b1222;color:#94a3b8;font-size:14px;padding-block:44px 120px}
@media(min-width:1024px){.ft{padding-bottom:50px}}
.ft-in{display:grid;gap:22px}
@media(min-width:900px){.ft-in{grid-template-columns:1.4fr 1fr}}
.ft b{color:#e2e8f0}
.ft p{line-height:1.8}
.ft nav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 18px;align-content:start}
@media(min-width:600px){.ft nav{grid-template-columns:repeat(3,minmax(0,1fr))}}
.ft nav a{color:#cbd5e1}
.ft .fine{margin-top:18px;font-size:12.5px;color:#64748b}

/* 하단 고정 바(모바일) */
.dock{position:fixed;left:0;right:0;bottom:0;z-index:90;display:grid;grid-template-columns:1fr auto;gap:8px;padding:10px var(--gut) calc(10px + env(safe-area-inset-bottom));background:rgba(15,23,42,.94);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);transform:translateY(110%);transition:transform .35s ease}
.dock.on{transform:none}
.dock .btn{min-height:52px;min-width:0;padding-inline:16px;font-size:16px}
.dock .btn .arr{display:none}
.dock .btn-line{padding-inline:18px}
@media(min-width:1024px){.dock{display:none}}

/* 하위 페이지 머리 */
.phero{background:radial-gradient(900px 500px at 85% 0%,#1b2b4d,rgba(19,33,61,0) 60%),var(--navy);color:#cbd5e1;padding-block:clamp(44px,6vw,90px) clamp(52px,6vw,90px)}
.phero h1{font-size:clamp(36px,5vw,66px);font-weight:840;line-height:1.16;letter-spacing:-.04em;color:#fff}
.phero h1 .hl{display:inline-block;margin-top:.12em;padding:.02em .16em .06em;background:#fff;color:var(--navy)}
.phero .lead{max-width:720px}
.crumb{display:flex;gap:8px;margin-bottom:22px;font-size:13.5px;color:#8f9cb1}
.crumb a:hover{color:#fff}

/* 서면별 */
.dtabs{position:sticky;top:var(--hd);z-index:20;background:rgba(255,255,255,.94);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.dtabs .wrap{display:flex;gap:6px;overflow-x:auto;padding-block:10px;scrollbar-width:none}
.dtabs .wrap::-webkit-scrollbar{display:none}
.dtabs a{flex:none;padding:9px 15px;border-radius:999px;background:var(--tint);font-size:14.5px;font-weight:720;color:var(--text)}
.dtabs a.on{background:var(--navy);color:#fff}
.dsec{display:grid;gap:30px;padding-block:clamp(56px,7vw,100px)}
.dsec+.dsec{padding-top:0}
@media(min-width:1000px){.dsec{grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:50px;align-items:start}.dsec .doc-col{position:sticky;top:calc(var(--hd) + 80px)}}
.dsec .h2{font-size:clamp(28px,3.4vw,44px)}
.dsec .due{display:inline-flex;align-items:center;gap:8px;margin-top:16px;padding:8px 14px;border-radius:12px;background:var(--urgent-l);color:var(--urgent);font-weight:780;font-size:15px}
.mist-list{display:grid;gap:12px;margin-top:26px}
.mist-list li{padding:18px 20px;border-radius:16px;background:var(--mist)}
.mist-list b{display:block;font-size:17px;color:var(--ink)}
.mist-list p{margin-top:4px;font-size:15.5px;color:var(--muted)}
.mist-list .law{margin-top:6px}

/* 변경 연표 */
.chg{display:grid;gap:12px}
.chg li{display:grid;gap:6px;padding:22px 24px;border-radius:18px;background:var(--paper)}
@media(min-width:800px){.chg li{grid-template-columns:160px 1fr;gap:24px;align-items:baseline}}
.chg time{font-size:15px;font-weight:820;color:var(--urgent)}
.chg b{display:block;font-size:18px;color:var(--ink)}
.chg p{margin-top:4px;color:var(--muted);font-size:15.5px}
.reasons{display:grid;gap:14px}
@media(min-width:900px){.reasons{grid-template-columns:1fr 1fr;gap:18px}}
.reasons li{padding:26px;border-radius:20px;background:var(--w-tint)}
.reasons b{display:block;font-size:20px;color:#fff;letter-spacing:-.02em}
.reasons p{margin-top:8px;color:#b8c3d4;font-size:15.5px}
.reasons .src{display:block;margin-top:10px;font-size:13px;color:#8f9cb1}
.reasons .src a{text-decoration:underline;text-underline-offset:3px}

/* 샘플 검토지 */
.sheet-doc{max-width:860px;margin-inline:auto;padding:clamp(26px,4vw,56px);border-radius:8px;background:var(--doc);box-shadow:var(--shadow);font-size:15.5px;color:#262a31;position:relative}
.sheet-doc::after{content:"샘플";position:absolute;right:28px;top:22px;padding:4px 12px;border-radius:999px;background:var(--pen-l);color:var(--pen);font-weight:800;font-size:13px}
.sheet-doc h2{font-size:clamp(24px,2.6vw,30px);font-weight:840;letter-spacing:-.03em;color:var(--ink)}
.sheet-doc h3{margin:34px 0 12px;font-size:19px;font-weight:800;color:var(--ink)}
.sheet-doc .meta2{display:grid;grid-template-columns:auto 1fr;gap:6px 18px;margin-top:18px;font-size:15px}
.sheet-doc .meta2 dt{color:var(--soft)}
.sheet-doc .summary{margin-top:22px;padding:20px 22px;border-radius:14px;background:var(--urgent-l)}
.sheet-doc .summary b{color:var(--urgent);font-size:18px}
.sheet-doc table{width:100%;border-collapse:collapse;font-size:14.5px}
.sheet-doc th,.sheet-doc td{padding:12px 14px;text-align:left;vertical-align:top}
.sheet-doc thead th{background:var(--navy);color:#fff;font-weight:720}
.sheet-doc thead th:first-child{border-radius:10px 0 0 10px}
.sheet-doc thead th:last-child{border-radius:0 10px 10px 0}
.sheet-doc tbody tr:nth-child(even) td{background:var(--tint)}
.sheet-doc .was{color:var(--pen);text-decoration:line-through}
.sheet-doc .now{color:var(--green);font-weight:700}
.sheet-doc .sig{display:flex;justify-content:flex-end;align-items:center;gap:16px;margin-top:40px;font-size:15px}
.sheet-doc .seal{display:grid;place-items:center;width:62px;height:62px;border-radius:50%;box-shadow:inset 0 0 0 2.5px var(--pen);color:var(--pen);font-weight:850;font-size:14px;transform:rotate(-8deg)}

/* 움직임 */
.rv{opacity:0;transform:translateY(22px);transition:opacity .8s ease,transform .8s cubic-bezier(.2,.8,.2,1)}
.rv.in{opacity:1;transform:none}
.rv-ln .ln{opacity:0;transform:translateY(.5em);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.8,.2,1)}
.rv-ln.in .ln{opacity:1;transform:none}
.rv-ln.in .ln:nth-child(2){transition-delay:.12s}
.rv-ln.in .ln:nth-child(3){transition-delay:.24s}
.no-js .rv,.no-js .rv-ln .ln{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
  .rv,.rv-ln .ln{opacity:1;transform:none}
  .outlets .track{animation:none}
}
@media print{.hd,.dock,.ft{display:none}}

/* 첫 화면 보조 */
.ai-bub .claim{background-image:linear-gradient(var(--pen),var(--pen));background-repeat:no-repeat;background-position:0 60%;background-size:0 2.5px;transition:background-size .5s ease}
.ai-bub .claim.struck{background-size:100% 2.5px}
/* 변호사 펜 답: 말풍선·답변서·'고칠 곳'과 겹치지 않는 자기 줄에 크게 쓰고, 펜으로 쓰듯 왼쪽부터 나타난다 */
.retort{position:relative;z-index:4;width:max-content;max-width:100%;margin:16px 0 24px 16px;font-size:clamp(32px,8.6vw,40px);color:#ff9b80;-webkit-text-stroke:.7px #ff9b80;text-shadow:0 2px 14px rgba(15,23,42,.6);transform:rotate(-3deg);transform-origin:0 50%;opacity:0;clip-path:inset(-30% 100% -30% 0);transition:clip-path .8s cubic-bezier(.45,0,.25,1),opacity .15s}
.retort.on{opacity:1;clip-path:inset(-30% -4% -30% 0)}
@media(min-width:1024px){.retort{margin:14px 0 22px 92px;font-size:40px}}
.no-js .retort,.no-js .count,.no-js .stamp{opacity:1}.no-js .retort{clip-path:none}
.stage-cap .again{margin-left:8px;padding:2px 10px;border:0;border-radius:999px;background:var(--w-tint);color:#cbd5e1;font-size:12px;cursor:pointer}
.trust{background:var(--navy-2);color:#cbd5e1}
.trust-in{display:flex;align-items:center;gap:14px 22px;flex-wrap:wrap;padding-block:18px}
.trust img{width:44px;height:44px;border-radius:50%;object-fit:cover;background:var(--navy-3)}
.trust p{font-size:15px;color:#fff}
.trust ul{display:flex;flex-wrap:wrap;gap:8px 8px}
.trust li{padding:6px 12px;border-radius:999px;background:var(--w-tint);font-size:13.5px;font-weight:650;color:#dbe3ef}
@media(min-width:1100px){.trust ul{margin-left:auto}}

/* 통계 · 법원 쪽 사실 */
.stats{display:grid;gap:14px}
@media(min-width:900px){.stats{grid-template-columns:repeat(3,1fr);gap:18px}}
.stat{padding:clamp(24px,3vw,34px);border-radius:22px;background:var(--mist)}
.num{display:flex;align-items:baseline;gap:4px;line-height:1;font-variant-numeric:tabular-nums}
.stat .num b{font-size:clamp(56px,6.4vw,84px);font-weight:860;letter-spacing:-.05em;color:var(--ink)}
.stat .num span{font-size:clamp(24px,2.4vw,32px);font-weight:800;color:var(--ink)}
.stat:nth-child(3) .num b,.stat:nth-child(3) .num span{color:var(--urgent)}
.stat>p:last-child{margin-top:14px;font-size:15.5px;color:var(--muted);line-height:1.6}
.facts{display:grid;gap:14px;margin-top:28px}
@media(min-width:900px){.facts{grid-template-columns:1fr 1fr 1.3fr}}
.facts>div{padding:24px;border-radius:20px;background:var(--w-tint)}
.facts .num b{font-size:clamp(40px,4.4vw,56px);font-weight:860;letter-spacing:-.04em;color:#fff}
.facts .num span{font-size:20px;font-weight:800;color:#fff;margin-left:2px}
.facts p{margin-top:10px;color:#b8c3d4;font-size:15px;line-height:1.55}
.facts .num{margin-top:0}
.facts p small{color:#8f9cb1;font-size:12.5px}
.facts .quote{margin-top:0;font-size:18px;font-weight:760;color:#fff;line-height:1.5}
.facts a{text-decoration:underline;text-underline-offset:3px}
.reasons .src a{color:#cbd5e1}

/* 2차 다듬기 */
.doc .notes li{padding-left:0}
.doc .notes li::before{content:none}
.stamp{right:-18px;bottom:-26px}
@media(max-width:1023px){.stamp{right:8px;bottom:-30px;width:96px;height:96px;font-size:15px}}
.duo .duo-tabs{display:flex}
@media(min-width:960px){.duo .duo-tabs{display:none}}
@media(min-width:1280px){.stage .kang{top:auto;bottom:calc(-1 * clamp(56px,7vw,100px))}.stage-glow{top:auto;bottom:40px}.who-card{top:auto;bottom:40px;right:-40px}}
@media(max-width:600px){.price-strip span{padding:8px 12px;font-size:14px}.price-strip b{font-size:17px}}
.stamp{left:150px;right:auto;bottom:14px}
@media(max-width:1023px){.stamp{left:auto;right:10px;bottom:-24px}}
@media(max-width:1399px){.who-card{display:none!important}}
@media(max-width:959px){.prices .price.main{order:-1}}

/* 법률 안내: 기존 남색·파랑 체계를 유지하고 긴 문장·출처를 읽기 좋게 배치 */
.guide-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.guide-card{display:flex;flex-direction:column;gap:16px;padding:28px;border:1px solid #dbe1ea;border-radius:20px;background:#fff}
.guide-card:hover{border-color:var(--blue);box-shadow:var(--shadow-s)}
.guide-card h3{font-size:23px;line-height:1.4;letter-spacing:-.025em}
.guide-card p{color:var(--muted);font-size:16px}
.guide-card>span{margin-top:auto;color:var(--blue);font-weight:750}
.guide-more{margin-top:28px}
.guide-head{padding-block:52px 42px;max-width:1000px}
.guide-head .crumb{color:var(--muted);margin-bottom:32px}
.guide-head h1{font-size:clamp(30px,4.2vw,52px);line-height:1.3;letter-spacing:-.035em;max-width:900px}
.guide-meta{margin-top:20px;font-size:14px;color:var(--muted)}
.guide-meta a,.guide-copy a:not(.btn),.guide-toc a{text-decoration:underline;text-underline-offset:4px}
.guide-answer{margin-top:28px;padding:26px 30px;background:var(--cloud);border-left:4px solid var(--blue);border-radius:0 16px 16px 0;font-size:clamp(18px,2vw,21px);font-weight:650;line-height:1.85}
.guide-layout{display:grid;grid-template-columns:240px minmax(0,760px);gap:56px;justify-content:center;align-items:start;padding-bottom:70px}
.guide-toc{position:sticky;top:calc(var(--hd) + 28px);padding:24px;background:var(--mist);border-radius:16px;font-size:15px}
.guide-toc b{display:block;margin-bottom:16px}.guide-toc li+li{margin-top:12px}
.guide-copy{max-width:820px;min-width:0;font-size:18px;line-height:1.9}
.guide-copy section+section{margin-top:54px}.guide-copy h2{font-size:clamp(24px,2.6vw,31px);line-height:1.45;margin-bottom:20px;letter-spacing:-.025em}
.guide-copy p+p{margin-top:18px}.guide-copy .guide-source{font-size:14px;color:var(--muted);margin-top:20px}
.guide-copy .faq .ans{font-size:17px}.guide-copy .faq summary{font-size:18px}
.guide-table{overflow-x:auto;border:1px solid #dbe1ea;border-radius:14px;margin-bottom:48px}
.guide-table table{border-collapse:collapse;width:100%;font-size:16px;line-height:1.65}
.guide-table caption{font-size:17px;text-align:left;font-weight:750;padding:16px 20px;background:var(--mist);color:var(--ink)}
.guide-table th,.guide-table td{padding:16px;text-align:left;vertical-align:top;border-top:1px solid #dbe1ea}
.guide-table thead{background:var(--cloud)}.guide-table tbody th{min-width:100px}
.guide-sources{padding-left:20px;list-style:disc;margin-bottom:22px}.guide-sources li+li{margin-top:10px}
.guide-next{padding:28px;border-radius:20px;background:var(--mist)}
.guide-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:24px}
.guide-actions .btn{white-space:normal;text-align:center;max-width:100%}
@media(max-width:900px){.guide-layout{grid-template-columns:1fr;gap:32px}.guide-toc{position:static}.guide-toc ol{display:grid;grid-template-columns:1fr 1fr;gap:12px 24px}.guide-toc li+li{margin-top:0}}
@media(max-width:600px){.guide-cards{grid-template-columns:1fr}.guide-card{padding:24px}.guide-head{padding-top:32px}.guide-answer{padding:20px}.guide-copy{font-size:17px}.guide-toc ol{grid-template-columns:1fr}.guide-table th,.guide-table td{padding:12px;font-size:14px}.guide-next{padding:22px}.guide-actions{display:grid}.guide-actions .btn{font-size:15px;padding-inline:18px}}