:root{
  --paper:#F2F0F5;
  --paper-2:#E8E3EF;
  --white:#FBFAFC;
  --plum:#3A2E52;
  --plum-2:#2D2340;
  --lilac:#AFA0C4;
  --mute:#5E5573;
  --line:#DCD5E5;
  --line-2:#C6BCD6;
  --on-plum:#F2F0F5;
  --on-plum-2:#CFC5DD;
  --g:20px;
  --ez:cubic-bezier(.19,1,.22,1);
  --kr:"Pretendard Variable","Pretendard",-apple-system,"Apple SD Gothic Neo","Malgun Gothic",sans-serif;
  --it:"Playfair Display",Georgia,serif;
  color-scheme:light;
}
@media(min-width:768px){:root{--g:40px}}
*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:72px}
body{background:var(--paper);color:var(--plum);font-family:var(--kr);font-size:17px;line-height:1.7;
  letter-spacing:-.01em;-webkit-font-smoothing:antialiased;word-break:keep-all;overflow-wrap:break-word}
::selection{background:var(--plum);color:var(--paper)}
a{color:inherit;text-underline-offset:4px;text-decoration-thickness:1px}
:focus-visible{outline:2px solid var(--plum);outline-offset:3px;border-radius:3px}
[tabindex="-1"]:focus{outline:none}
html{scrollbar-color:var(--lilac) var(--paper)}
.ph{width:1.1em;height:1.1em;fill:currentColor;vertical-align:-.17em;flex:none}
.wrap{max-width:1120px;margin:0 auto;padding-inline:var(--g)}
.num{font-variant-numeric:tabular-nums;letter-spacing:-.02em}

/* 헤더: 카톡방 배경과 같은 구성 (왼쪽 Ourleap, 오른쪽 메뉴) */
.top{position:sticky;top:0;z-index:5;background:rgba(242,240,245,.92);-webkit-backdrop-filter:saturate(1.4) blur(10px);
  backdrop-filter:saturate(1.4) blur(10px);border-bottom:1px solid transparent;transition:border-color .3s}
.top.scrolled{border-bottom-color:var(--line)}
.top .wrap{display:flex;align-items:center;justify-content:space-between;height:60px}
.en{font-family:var(--it);font-style:italic;font-weight:900;letter-spacing:-.01em}
.brand{font-size:25px;text-decoration:none;line-height:1}
.nav{display:flex;gap:2px}
.nav a{white-space:nowrap;text-decoration:none;color:var(--mute);font-size:15px;font-weight:500;padding:8px 10px;border-radius:999px;transition:color .2s,background .2s}
.nav a:hover{color:var(--plum);background:var(--paper-2)}
.nav .d{display:none}
@media(min-width:640px){.nav .d{display:inline}}

/* 히어로 */
.hero{padding-top:44px;position:relative}
.wm{display:block;font-weight:900;font-size:clamp(76px,19vw,200px);line-height:1;letter-spacing:-.04em;margin-left:-.04em;
  user-select:none}
.wm img{display:block;width:min(100%,880px);height:auto}
@media(min-width:1100px){.wm img{width:640px}}
.hero h1{margin-top:28px;font-size:clamp(34px,6.4vw,64px);line-height:1.18;font-weight:800;letter-spacing:-.04em;max-width:12em}
.hero p{margin-top:18px;color:var(--mute);max-width:26em;font-size:clamp(17px,1.6vw,19px)}
.cta{display:flex;flex-wrap:wrap;gap:10px;margin-top:30px}
.btn{display:inline-flex;align-items:center;gap:10px;background:var(--plum);color:var(--paper);font:inherit;font-weight:700;
  font-size:16px;padding:15px 24px;border-radius:999px;text-decoration:none;border:0;cursor:pointer;
  transition:transform .3s var(--ez),background .2s}
.btn:hover{background:var(--plum-2)}
.btn:hover .ph-arrow-right,.btn:hover .ph-arrow-down{transform:translateY(2px)}
.btn .ph{transition:transform .3s var(--ez)}
.btn:active{transform:scale(.97)}
.btn.ghost{background:transparent;color:var(--plum);box-shadow:inset 0 0 0 1px var(--line-2)}
.btn.ghost:hover{background:var(--paper-2)}


/* 데스크톱 히어로 오른쪽: 실제 질문지 미리보기 */
.preview{display:none}
@media(min-width:1100px){
  .preview{display:block;position:absolute;right:var(--g);top:150px;width:360px;padding:24px;background:var(--white);border-radius:22px;
    text-decoration:none;box-shadow:0 1px 0 var(--line),0 30px 60px -30px rgba(58,46,82,.45);transform:rotate(2deg);
    transition:transform .5s var(--ez),box-shadow .5s var(--ez)}
  .preview:hover{transform:rotate(0) translateY(-4px);box-shadow:0 1px 0 var(--line),0 40px 70px -30px rgba(58,46,82,.5)}
  .preview strong{display:block;font-size:20px;font-weight:800;letter-spacing:-.035em}
  .preview ol{list-style:none;margin-top:16px;display:grid;gap:10px}
  .preview li{font-size:15px;font-weight:600;line-height:1.5}
  .preview li span{display:block;height:30px;margin-top:6px;background:var(--paper);border-radius:8px;border:1px solid var(--line)}
  .preview em{display:flex;justify-content:space-between;margin-top:16px;font-style:normal;font-size:14px;font-weight:700;color:var(--mute)}
}

/* 사선 띠와 발판 두 개: 카톡방 배경의 도약 장치 */
.ramp{position:relative;margin-top:64px;height:120px}
.ramp::before{content:"";position:absolute;inset:0;background:var(--paper-2);
  clip-path:polygon(0 62%,52% 62%,62% 0,100% 0,100% 100%,0 100%)}
.steps{position:absolute;right:max(var(--g),calc((100vw - 1120px)/2 + 40px));top:34px;width:150px;height:80px}
.steps i{position:absolute;width:74px;height:46px;clip-path:polygon(38% 0,100% 0,62% 100%,0 100%)}
.steps .s1{left:0;bottom:0;background:var(--lilac)}
.steps .s2{left:58px;bottom:22px;background:var(--plum)}
@media(prefers-reduced-motion:no-preference){
  .steps .s1{animation:step .9s .3s var(--ez) both}
  .steps .s2{animation:step2 1.1s .55s var(--ez) both}
  @keyframes step{from{transform:translate(-30px,20px);opacity:0}}
  @keyframes step2{from{transform:translate(-58px,22px);opacity:0}}
}

/* 띠 위 영역 */
.on-band{background:var(--paper-2)}
section{padding-block:72px}
@media(min-width:900px){section{padding-block:104px}}
.on-band section:first-child{padding-top:24px}
.on-band{padding-bottom:24px}
#records{padding-top:96px}
h2{font-size:clamp(28px,3.6vw,40px);line-height:1.25;font-weight:800;letter-spacing:-.04em;max-width:16em}
.lede{color:var(--mute);margin-top:12px;max-width:30em}

/* 자료실: 일하는 순서대로 이어진 발판 */
.path{list-style:none;margin-top:36px;display:grid;gap:12px}
@media(min-width:900px) and (max-width:1099px){.path{grid-template-columns:1fr 1fr;gap:16px}}
.path a{position:relative;display:grid;gap:6px;align-content:start;padding:24px 22px 22px;background:var(--white);border-radius:18px;
  text-decoration:none;box-shadow:0 1px 0 var(--line),0 10px 30px -18px rgba(58,46,82,.35);
  transition:transform .4s var(--ez),box-shadow .4s var(--ez)}
.path a:hover{transform:translateY(-3px);box-shadow:0 1px 0 var(--line),0 18px 40px -18px rgba(58,46,82,.45)}
.step{display:flex;align-items:center;gap:10px;font-size:15px;font-weight:700;color:var(--mute);margin-bottom:12px}
.step b{width:26px;height:16px;background:var(--lilac);clip-path:polygon(38% 0,100% 0,62% 100%,0 100%);transition:background .3s,transform .4s var(--ez)}
.path li:hover .step b{background:var(--plum);transform:translateX(4px)}
.path li{display:flex;flex-direction:column}
.path li:last-child .step b{background:var(--plum)}
@media(min-width:1100px){
  .path{grid-template-columns:repeat(4,1fr);gap:14px;align-items:end;padding-top:84px}
  .path li:nth-child(1){margin-bottom:0}
  .path li:nth-child(2){margin-bottom:28px}
  .path li:nth-child(3){margin-bottom:56px}
  .path li:nth-child(4){margin-bottom:84px}
  .path a{flex:1}
}
.path h3{font-size:clamp(20px,1.9vw,22px);font-weight:800;letter-spacing:-.035em;line-height:1.35;
  display:flex;justify-content:space-between;align-items:center;gap:12px}
.path h3 .ph{flex:none;width:36px;height:36px;padding:9px;border-radius:50%;background:var(--paper);vertical-align:0;transition:transform .4s var(--ez),background .3s,color .3s}
.path a:hover h3 .ph{background:var(--plum);color:var(--paper);transform:rotate(-45deg)}
.path .what{color:var(--mute);font-size:16px}
.peek{margin-top:10px;padding:12px 14px;background:var(--paper);border-radius:12px;font-size:15px;line-height:1.6}
.peek i{font-style:normal;color:var(--mute);font-weight:700;margin-right:8px}
.fmt{font-size:14px;color:var(--mute);margin-top:6px}

/* 계약 장부 */
.ledger-h{display:grid;gap:12px}
.ledger{margin-top:36px;border-top:2px solid var(--plum)}
.row{display:grid;grid-template-columns:1fr auto;gap:4px 16px;padding:18px 0;border-bottom:1px solid var(--line)}
.row b{font-size:18px;font-weight:700;letter-spacing:-.025em}
.row .amt{font-size:18px;font-weight:700;text-align:right;white-space:nowrap}
.row .how{grid-column:1/-1;grid-row:2;color:var(--mute);font-size:15px}
.row b{grid-row:1;grid-column:1}.row .amt{grid-row:1;grid-column:2}
.row .tag{display:inline-block;font-size:13px;font-weight:600;color:var(--plum);background:var(--paper-2);border-radius:6px;
  padding:1px 8px;margin-right:6px}
@media(min-width:900px){
  .row{grid-template-columns:200px 1fr 150px;align-items:baseline}
  .row .how{grid-column:2;grid-row:1}.row .amt{grid-column:3}
}
.ledger-note{margin-top:16px;font-size:14px;color:var(--mute);max-width:44em}
.insight{margin-top:44px;display:grid;gap:20px}
@media(min-width:900px){.insight{grid-template-columns:1fr 1fr;gap:40px;align-items:end}}
.insight p.big{font-size:clamp(22px,2.6vw,30px);font-weight:800;letter-spacing:-.035em;line-height:1.4}
.route{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-size:15px;font-weight:600}
.route span{background:var(--white);border-radius:999px;padding:8px 14px;box-shadow:inset 0 0 0 1px var(--line)}
.route .ph{color:var(--lilac)}

/* 만드는 사람 */
.facts{display:grid;gap:28px;margin-top:36px}
@media(min-width:900px){.facts{grid-template-columns:repeat(3,1fr);gap:40px}}
.facts div{border-top:1px solid var(--line-2);padding-top:16px}
.facts b{display:block;font-size:18px;font-weight:700;letter-spacing:-.025em;margin-bottom:6px}
.facts span{color:var(--mute);font-size:16px}

/* 부산 강의: 로고 타일과 같은 플럼 면 */
.class{background:var(--plum);color:var(--on-plum);border-radius:28px;padding:36px 24px;display:grid;gap:28px;
  position:relative;overflow:hidden}
@media(min-width:900px){.class{grid-template-columns:1fr 1.15fr;padding:56px;gap:56px}}
.class .steps{right:28px;top:28px;opacity:.9}
@media(min-width:900px){.class .steps{top:auto;bottom:40px;right:48px}}
.class .steps .s1{background:var(--lilac);opacity:.5}
.class .steps .s2{background:var(--on-plum)}
.status{display:inline-flex;font-size:13px;font-weight:700;border:1px solid rgba(242,240,245,.35);border-radius:999px;padding:4px 12px}
.date{font-family:var(--it);font-style:italic;font-weight:900;font-size:clamp(84px,12vw,136px);letter-spacing:-.02em;line-height:1}
.date small{display:block;font-family:var(--kr);font-style:normal;font-size:17px;font-weight:600;letter-spacing:-.01em;color:var(--on-plum-2);margin-top:14px}
.class h3{font-size:clamp(22px,2.4vw,28px);font-weight:800;letter-spacing:-.035em;line-height:1.35}
.flow{list-style:none;margin-top:20px;display:grid;gap:6px;counter-reset:f}
.flow li{display:flex;gap:12px;align-items:center;font-size:16px}
.flow li::before{counter-increment:f;content:counter(f);font-size:13px;font-weight:700;width:24px;height:24px;flex:none;
  display:grid;place-items:center;border-radius:50%;background:rgba(242,240,245,.12);font-variant-numeric:tabular-nums}
.tbd{margin-top:22px;padding-top:18px;border-top:1px solid rgba(242,240,245,.2);font-size:15px;color:var(--on-plum-2)}
.tbd b{color:var(--on-plum);font-weight:700}
.class .btn{background:var(--paper);color:var(--plum);margin-top:22px}
.class .btn:hover{background:#fff}

/* 자주 묻는 질문 */
.faq{margin-top:28px;border-top:1px solid var(--line-2)}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:16px;
  padding:20px 0;font-size:18px;font-weight:700;letter-spacing:-.025em}
.faq summary::-webkit-details-marker{display:none}
.faq summary .ph{color:var(--mute);transition:transform .4s var(--ez);flex:none}
.faq details[open] summary .ph{transform:rotate(45deg)}
.faq details p{color:var(--mute);padding:0 0 22px;max-width:34em}

footer{border-top:1px solid var(--line);padding:36px 0 56px;color:var(--mute);font-size:14px}
footer .wrap{display:flex;flex-wrap:wrap;gap:12px 24px;justify-content:space-between;align-items:center}
footer .en{font-size:22px;color:var(--plum)}

/* 자료 리더: 주소 #해시로 열리는 전체 화면 */
.reader{display:none;position:fixed;inset:0;z-index:20;background:var(--paper);overflow-y:auto;overscroll-behavior:contain}
.reader:target{display:block}
body:has(.reader:target){overflow:hidden}
@media(prefers-reduced-motion:no-preference){
  .reader:target{animation:open .6s var(--ez) both}
  @keyframes open{from{clip-path:inset(100% 0 0 0 round 28px)}to{clip-path:inset(0 0 0 0 round 0)}}
}
.r-bar{position:sticky;top:0;z-index:2;background:rgba(242,240,245,.94);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line)}
.r-bar-in{max-width:760px;margin:0 auto;height:60px;padding:0 var(--g);display:flex;align-items:center;justify-content:space-between;gap:12px}
.r-bar a,.r-bar button{display:inline-flex;align-items:center;gap:8px;font:inherit;font-size:15px;font-weight:600;color:var(--plum);
  background:none;border:0;padding:8px 12px;margin:0 -12px;border-radius:999px;cursor:pointer;text-decoration:none;transition:background .2s}
.r-bar a:hover,.r-bar button:hover{background:var(--paper-2)}
.r-body{max-width:760px;margin:0 auto;padding:40px var(--g) 96px}
.r-body h1{font-size:clamp(32px,5vw,46px);line-height:1.22;font-weight:800;letter-spacing:-.04em}
.r-body .intro{color:var(--mute);margin-top:16px;max-width:34em}
.r-body h2{font-size:23px;margin-top:56px;margin-bottom:6px;letter-spacing:-.035em}
.r-body .note{color:var(--mute);font-size:16px;max-width:36em}
.r-body ul.tips{margin-top:24px;padding-left:20px;display:grid;gap:10px}
.r-body ul.tips li::marker{color:var(--lilac)}
.r-foot{margin-top:64px;padding-top:24px;border-top:1px solid var(--line);display:flex;flex-wrap:wrap;gap:12px;align-items:center;justify-content:space-between}
.r-foot p{color:var(--mute);font-size:15px}
.btn.line{background:var(--white);color:var(--plum);box-shadow:inset 0 0 0 1px var(--line-2)}
.btn.line:hover{background:var(--paper-2)}

.qs{list-style:none;margin-top:20px;counter-reset:q;display:grid;gap:10px}
.qs li{padding:20px;background:var(--white);border-radius:16px}
.qs b{display:flex;gap:12px;font-size:18px;font-weight:700;letter-spacing:-.025em;line-height:1.45}
.qs b::before{counter-increment:q;content:"Q" counter(q);color:var(--mute);font-size:14px;font-weight:700;min-width:28px;padding-top:3px}
.qs .why{display:block;color:var(--mute);font-size:15px;margin:4px 0 12px 40px}
.field{display:block;margin-left:40px}
.field span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
@media(max-width:520px){.qs .why,.field{margin-left:0}}
textarea,input[type=text]{width:100%;font:inherit;font-size:16px;color:var(--plum);background:var(--paper);
  border:1px solid #857A9B;border-radius:12px;padding:11px 14px;resize:vertical;transition:border-color .2s,background .2s}
textarea{min-height:52px}
textarea::placeholder,input::placeholder{color:#675E7C}
textarea:focus,input:focus{outline:none;border-color:var(--plum);background:#fff}

.checks{list-style:none;margin-top:16px;background:var(--white);border-radius:16px;padding:4px 20px}
.checks li+li{border-top:1px solid var(--line)}
.checks label{display:flex;gap:14px;padding:16px 0;cursor:pointer;align-items:flex-start}
.checks input{appearance:none;flex:none;width:22px;height:22px;border:1.5px solid #857A9B;border-radius:7px;
  margin-top:3px;display:grid;place-items:center;cursor:pointer;background:#fff;transition:background .2s,border-color .2s}
.checks input::after{content:"";width:6px;height:11px;border:solid var(--paper);border-width:0 2.5px 2.5px 0;
  transform:rotate(45deg) translate(-1px,-1px) scale(0);transition:transform .3s var(--ez)}
.checks input:checked{background:var(--plum);border-color:var(--plum)}
.checks input:checked::after{transform:rotate(45deg) translate(-1px,-1px) scale(1)}
.checks input:checked + span{color:var(--mute);text-decoration:line-through;text-decoration-color:var(--line-2)}
.checks em{font-style:normal;display:block;color:var(--mute);font-size:15px;margin-top:2px}
.count{font-size:15px;color:var(--mute);margin-top:12px;display:flex;justify-content:space-between;align-items:center}
.count button{font:inherit;font-size:14px;color:var(--mute);background:none;border:0;text-decoration:underline;text-underline-offset:4px;cursor:pointer}

.parts{margin-top:20px;background:var(--white);border-radius:16px;padding:4px 20px}
.parts div{display:grid;gap:4px;padding:16px 0}
.parts div+div{border-top:1px solid var(--line)}
@media(min-width:720px){.parts div{grid-template-columns:140px 1fr 80px;gap:20px;align-items:baseline}}
.parts b{font-weight:700}
.parts p{font-size:16px}
.parts small{color:var(--mute);font-size:14px}
blockquote{margin-top:24px;padding:18px 20px;background:var(--paper-2);border-radius:16px;font-size:16px}

.inputs{display:grid;gap:16px;margin-top:20px}
.inputs label{display:grid;gap:6px;font-size:15px;color:var(--mute);font-weight:600}
.out{margin-top:28px;background:var(--plum);border-radius:18px;overflow:hidden;color:var(--on-plum)}
.out-h{display:flex;justify-content:space-between;align-items:center;padding:12px 12px 12px 18px;font-size:14px;color:var(--on-plum-2);
  border-bottom:1px solid rgba(242,240,245,.15)}
.out-h button{display:inline-flex;align-items:center;gap:6px;font:inherit;font-size:14px;font-weight:700;color:var(--plum);
  background:var(--paper);border:0;border-radius:999px;padding:8px 16px;cursor:pointer;transition:transform .2s var(--ez)}
.out-h button:active{transform:scale(.96)}
pre{white-space:pre-wrap;font-family:var(--kr);font-size:15px;line-height:1.75;padding:18px;max-height:420px;overflow:auto;color:var(--on-plum-2)}
pre mark{background:none;color:#fff;font-weight:700}
.four{margin-top:16px;background:var(--white);border-radius:16px;padding:4px 20px}
.four div{display:grid;grid-template-columns:88px 1fr;gap:12px;padding:14px 0}
.four div+div{border-top:1px solid var(--line)}
.four b{font-weight:700}
.four span{color:var(--mute);font-size:16px}

.toast{position:fixed;left:50%;bottom:28px;z-index:30;transform:translate(-50%,20px);opacity:0;pointer-events:none;
  background:var(--plum);color:var(--paper);font-weight:700;font-size:15px;padding:11px 20px;border-radius:999px;
  transition:transform .4s var(--ez),opacity .25s}
.toast.on{transform:translate(-50%,0);opacity:1}

/* ───────── 여러 페이지 구조 (업노마드식 메뉴 + 클래스 허브) ───────── */
body{padding-bottom:0}
.ann{display:block;background:var(--plum);color:var(--paper);text-align:center;font-size:14px;font-weight:600;padding:9px var(--g);
  text-decoration:none;transition:background .2s}
.ann:hover{background:var(--plum-2)}
.ann span{opacity:.75;font-weight:500;margin-left:6px}
.top .wrap{gap:16px}
.gnb{display:flex;align-items:center;gap:2px;margin-right:auto;margin-left:28px}
.gnb a{white-space:nowrap;text-decoration:none;color:var(--mute);font-size:15px;font-weight:600;padding:8px 12px;border-radius:999px;transition:color .2s,background .2s}
.gnb a:hover,.gnb a[aria-current="page"]{color:var(--plum);background:var(--paper-2)}
.pill{display:inline-flex;align-items:center;gap:6px;white-space:nowrap;background:var(--plum);color:var(--paper);font-size:14px;font-weight:700;
  padding:9px 16px;border-radius:999px;text-decoration:none;transition:background .2s}
.pill:hover{background:var(--plum-2)}
.gnb-m{display:none}
@media(max-width:759px){
  .gnb{display:none}
  .gnb-m{display:flex;gap:4px;overflow-x:auto;padding:0 var(--g) 10px;scrollbar-width:none}
  .gnb-m::-webkit-scrollbar{display:none}
  .gnb-m a{white-space:nowrap;text-decoration:none;color:var(--mute);font-size:15px;font-weight:600;padding:7px 12px;border-radius:999px;background:var(--white);box-shadow:inset 0 0 0 1px var(--line)}
  .gnb-m a[aria-current="page"]{color:var(--paper);background:var(--plum);box-shadow:none}
  .pill{padding:8px 13px;font-size:13px}
}

/* 히어로 문구: 줄 단위로 끊어 읽힌다 */
.hero h1{max-width:none}
.hero p.sub{margin-top:20px;color:var(--mute);font-size:clamp(17px,1.7vw,20px);line-height:1.65;max-width:none}
.cta .btn.ghost{background:var(--white);box-shadow:inset 0 0 0 1px var(--line-2)}

/* 데스크톱 히어로 오른쪽: 다가오는 클래스 */
.upnext{display:none}
@media(min-width:1100px){
  .upnext{display:block;position:absolute;right:var(--g);top:120px;width:360px;padding:26px;background:var(--white);border-radius:22px;
    box-shadow:0 1px 0 var(--line),0 30px 60px -30px rgba(58,46,82,.45);transform:rotate(2deg)}
  .upnext strong{display:block;font-size:19px;font-weight:800;letter-spacing:-.035em;margin-bottom:10px}
  .upnext a{display:grid;grid-template-columns:78px 1fr auto;align-items:center;gap:12px;padding:14px 0;text-decoration:none;border-top:1px solid var(--line)}
  .upnext a:hover .ph{transform:translateX(4px)}
  .upnext .d{font-family:var(--it);font-style:italic;font-weight:900;font-size:30px;line-height:1}
  .upnext b{display:block;font-size:16px;font-weight:700;letter-spacing:-.025em}
  .upnext small{font-size:14px;color:var(--mute)}
  .upnext .ph{transition:transform .3s var(--ez);color:var(--mute)}
}

/* 섹션 머리: 제목 + 전체 보기 */
.sec-h{display:flex;justify-content:space-between;align-items:flex-end;gap:16px;flex-wrap:wrap}
.more{display:inline-flex;align-items:center;gap:6px;font-size:15px;font-weight:700;text-decoration:none;color:var(--plum);padding:8px 0}
.more:hover .ph{transform:translateX(4px)}
.more .ph{transition:transform .3s var(--ez)}
h2 .br,.lede .br{display:block}

/* 클래스 카드 (업노마드 /361 구조) */
.classes{display:grid;gap:16px;margin-top:32px}
@media(min-width:760px){.classes{grid-template-columns:repeat(3,1fr);gap:20px}}
.ccard{display:flex;flex-direction:column;background:var(--white);border-radius:20px;overflow:hidden;text-decoration:none;
  box-shadow:0 1px 0 var(--line),0 12px 32px -20px rgba(58,46,82,.4);transition:transform .4s var(--ez),box-shadow .4s var(--ez)}
.ccard:hover{transform:translateY(-4px);box-shadow:0 1px 0 var(--line),0 22px 44px -20px rgba(58,46,82,.5)}
.thumb{position:relative;aspect-ratio:4/3;background:var(--plum);color:var(--paper);overflow:hidden;padding:22px}
.thumb.light{background:var(--paper-2);color:var(--plum)}
.thumb .city{position:absolute;left:22px;bottom:18px;font-weight:900;font-size:clamp(64px,7vw,84px);letter-spacing:-.04em;line-height:1}
.thumb .when{font-family:var(--it);font-style:italic;font-weight:900;font-size:30px;line-height:1}
.thumb .when small{display:block;font-family:var(--kr);font-style:normal;font-size:14px;font-weight:600;opacity:.8;margin-top:8px}
.thumb .badge{position:absolute;right:16px;top:16px;font-size:13px;font-weight:700;background:var(--paper);color:var(--plum);padding:5px 11px;border-radius:999px}
.thumb.light .badge{background:var(--plum);color:var(--paper)}
.thumb .steps{right:18px;top:auto;bottom:22px;width:110px;height:60px}
.thumb .steps i{width:54px;height:34px}
.thumb .steps .s2{left:42px;bottom:16px;background:var(--paper)}
.thumb.light .steps .s2{background:var(--plum)}
.thumb .steps .s1{opacity:.7}
.cbody{display:grid;gap:6px;padding:20px 22px 22px;flex:1;align-content:start}
.cbody .meta{font-size:14px;color:var(--mute);font-weight:600}
.cbody h3{font-size:20px;font-weight:800;letter-spacing:-.035em;line-height:1.35}
.cbody dl{display:grid;grid-template-columns:52px 1fr;gap:4px 10px;margin-top:8px;font-size:15px}
.cbody dt{color:var(--mute)}
.cbody dd{font-weight:600}
.cbody .go{margin-top:14px;display:flex;justify-content:center;align-items:center;gap:8px;background:var(--paper);border-radius:12px;
  padding:13px;font-size:15px;font-weight:700;transition:background .2s,color .2s}
.ccard:hover .go{background:var(--plum);color:var(--paper)}
.scarce{margin-top:10px;color:var(--mute)}

/* 배우는 것: 다섯 단계 발판 */
.learn{list-style:none;display:grid;gap:12px;margin-top:32px;counter-reset:l}
@media(min-width:900px){.learn{grid-template-columns:repeat(5,1fr);align-items:end}
  .learn li:nth-child(2){margin-bottom:18px}.learn li:nth-child(3){margin-bottom:36px}.learn li:nth-child(4){margin-bottom:54px}.learn li:nth-child(5){margin-bottom:72px}}
.learn li{background:var(--white);border-radius:18px;padding:20px;box-shadow:0 1px 0 var(--line)}
.learn li::before{counter-increment:l;content:counter(l);display:grid;place-items:center;width:30px;height:30px;border-radius:50%;
  background:var(--paper-2);font-size:14px;font-weight:800;margin-bottom:12px}
.learn li:last-child::before{background:var(--plum);color:var(--paper)}
.learn b{display:block;font-size:18px;font-weight:800;letter-spacing:-.035em;line-height:1.35}
.learn span{display:block;color:var(--mute);font-size:15px;margin-top:6px;line-height:1.6}

/* 무료 자료 표지 그리드 (업노마드 칼럼 그리드 구조) */
.covers{display:grid;gap:16px;margin-top:32px}
@media(min-width:640px){.covers{grid-template-columns:1fr 1fr}}
@media(min-width:1000px){.covers{grid-template-columns:repeat(4,1fr)}}
.rcard{display:flex;flex-direction:column;text-decoration:none;gap:12px}
.cover{position:relative;aspect-ratio:3/4;border-radius:18px;overflow:hidden;padding:20px;display:flex;flex-direction:column;
  box-shadow:0 1px 0 var(--line),0 14px 34px -22px rgba(58,46,82,.5);transition:transform .45s var(--ez),box-shadow .45s var(--ez)}
.rcard:hover .cover{transform:translateY(-4px) rotate(-1deg);box-shadow:0 1px 0 var(--line),0 26px 44px -22px rgba(58,46,82,.55)}
.cover.c1{background:var(--plum);color:var(--paper)}
.cover.c2{background:var(--white);color:var(--plum)}
.cover.c3{background:var(--lilac);color:var(--plum-2)}
.cover.c4{background:var(--paper-2);color:var(--plum)}
.cover .en{font-size:18px}
.cover .t{margin-top:auto;font-weight:900;font-size:clamp(28px,3vw,34px);letter-spacing:-.04em;line-height:1.12}
.cover .n{margin-top:12px;font-size:13px;font-weight:700;opacity:.8}
.cover .steps{right:16px;top:18px;width:84px;height:46px}
.cover .steps i{width:40px;height:26px}
.cover .steps .s2{left:32px;bottom:12px}
.c1 .steps .s2{background:var(--paper)}
.c3 .steps .s1{background:var(--paper)}
.rcard .rt{font-size:18px;font-weight:800;letter-spacing:-.035em;line-height:1.35}
.rcard .rd{color:var(--mute);font-size:15px;line-height:1.6;margin-top:-6px}

/* 이야기 페이지 (업노마드 /about 서사 구조) */
.chap{display:grid;gap:18px;padding-block:56px;border-top:1px solid var(--line)}
@media(min-width:900px){.chap{grid-template-columns:260px 1fr;gap:48px}}
.chap .no{font-family:var(--it);font-style:italic;font-weight:900;font-size:56px;line-height:1;color:var(--lilac)}
.chap h2{font-size:clamp(26px,3vw,34px)}
.chap p{color:var(--mute);margin-top:14px;max-width:34em}
.chap p b{color:var(--plum)}

/* 자료 페이지는 독립 페이지 */
.reader{display:block!important;position:static;background:none;overflow:visible;animation:none!important}
.r-bar{position:static;background:none;border:0}
.r-bar-in{padding-top:8px}

/* 모바일 하단 고정 버튼 */
.dock{position:fixed;left:0;right:0;bottom:0;z-index:6;padding:10px var(--g) calc(10px + env(safe-area-inset-bottom));
  background:rgba(242,240,245,.94);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-top:1px solid var(--line);display:flex;gap:8px}
.dock a{flex:1;display:flex;justify-content:center;align-items:center;gap:8px;padding:14px;border-radius:14px;font-weight:700;font-size:16px;text-decoration:none}
.dock .a1{background:var(--plum);color:var(--paper)}
.dock .a2{background:var(--white);box-shadow:inset 0 0 0 1px var(--line-2)}
@media(min-width:760px){.dock{display:none}}
@media(max-width:759px){body.has-dock{padding-bottom:84px}}

footer .biz{flex-basis:100%;font-size:13px;color:var(--mute);line-height:1.8}
footer nav{display:flex;gap:16px;flex-wrap:wrap}
footer nav a{text-decoration:none}

@media(min-width:900px){.lede,.hero p.sub{max-width:46em}}
.r-body .intro{max-width:44em}

/* 강의 일정 드롭다운 (데스크톱) */
.dd{position:relative}
.dd > a{display:inline-flex;align-items:center;gap:4px}
.dd > a .ph{width:.9em;height:.9em;transition:transform .3s var(--ez)}
.dd-menu{position:absolute;left:0;top:calc(100% + 6px);min-width:190px;display:grid;padding:8px;background:var(--white);border-radius:14px;
  box-shadow:0 1px 0 var(--line),0 18px 40px -16px rgba(58,46,82,.4);opacity:0;visibility:hidden;transform:translateY(-4px);
  transition:opacity .2s,transform .3s var(--ez),visibility .2s}
.dd-menu::before{content:"";position:absolute;left:0;right:0;top:-8px;height:8px}
.dd:hover .dd-menu,.dd:focus-within .dd-menu{opacity:1;visibility:visible;transform:none}
.dd:hover > a .ph{transform:rotate(180deg)}
.dd-menu a{display:block;border-radius:10px;padding:10px 12px}

/* 강의 일정 하위 탭 */
.tabs{display:inline-flex;gap:4px;margin-top:20px;padding:5px;background:var(--white);border-radius:999px;box-shadow:inset 0 0 0 1px var(--line)}
.tabs a{text-decoration:none;font-size:15px;font-weight:700;color:var(--mute);padding:10px 18px;border-radius:999px;transition:background .2s,color .2s}
.tabs a[aria-current="page"]{background:var(--plum);color:var(--paper)}
.tabs + .lede{margin-top:20px}

/* 모집 중 배지와 참가비 설명 */
.thumb .badge.on{background:var(--lilac);color:var(--plum-2)}
.cbody dd small{display:block;font-weight:500;color:var(--mute);font-size:13px;margin-top:2px}
.soon{margin-top:28px}
@media(min-width:1100px){.upnext a{grid-template-columns:104px 1fr auto}.upnext .d{font-size:27px;white-space:nowrap}}
.thumb .when{white-space:nowrap}

/* 눈누 폰트: 로고 = 카페24 모야모야, 카톡 배경의 한 줄 문구 = 카페24 PRO Slim Bold */
@font-face{font-family:"Moyamoya";src:url("/fonts/moyamoya-wordmark.woff2") format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"ProSlim";src:url("/fonts/ProSlim-Bold.woff2") format("woff2");font-weight:700;font-display:swap}
.wm{font-family:"Moyamoya","Pretendard Variable",sans-serif;font-weight:400;font-size:clamp(78px,21.5vw,176px);line-height:1.05;letter-spacing:0;margin-left:-.04em;white-space:nowrap}
@media(min-width:1100px){.wm{font-size:172px}}
.hero h1{font-family:"ProSlim","Pretendard Variable",sans-serif;font-weight:700;font-size:clamp(46px,9.6vw,84px);line-height:1.12;letter-spacing:-.01em}

/* ───────── 강하게: 형광펜 · 큰 숫자 · 플럼 면 · D-day (vibisolution·무료강의 랜딩 13개 공통 장치) ───────── */
.hl{background:linear-gradient(transparent 52%,rgba(175,160,196,.75) 52%);padding:0 .08em;color:inherit}
.drench .hl{background:var(--lilac);color:var(--plum-2);padding:0 .18em;border-radius:4px}
.drench{background:var(--plum);color:var(--on-plum)}
.drench .lede,.drench p{color:var(--on-plum-2)}
.drench h2{color:var(--on-plum)}
.big-h{font-size:clamp(34px,5.4vw,60px);line-height:1.18;font-weight:900;letter-spacing:-.04em}

.dday{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px}
.dday a{display:inline-flex;align-items:center;gap:10px;text-decoration:none;background:var(--white);border-radius:999px;
  padding:7px 14px 7px 8px;font-size:15px;font-weight:700;box-shadow:inset 0 0 0 1px var(--line)}
.dday a b{background:var(--plum);color:var(--paper);border-radius:999px;padding:3px 10px;font-size:14px;font-variant-numeric:tabular-nums}

/* 이런 분께 */
.who-grid{display:grid;gap:14px;margin-top:32px}
@media(min-width:900px){.who-grid{grid-template-columns:repeat(2,1fr);gap:18px}}
.who-card{position:relative;background:var(--white);border-radius:22px;padding:26px 24px;box-shadow:0 1px 0 var(--line);overflow:hidden}
.who-card .q{font-size:clamp(20px,2.2vw,24px);font-weight:800;letter-spacing:-.035em;line-height:1.4}
.who-card .q::before{content:"“";display:block;font-family:var(--it);font-style:italic;font-weight:900;font-size:56px;line-height:.6;color:var(--lilac);margin-bottom:10px}
.who-card .a{margin-top:16px;padding-top:16px;border-top:1px dashed var(--line-2);color:var(--mute);font-size:16px;line-height:1.7}
.who-card .a b{color:var(--plum)}
.who-card .tag{position:absolute;right:20px;top:22px;font-size:13px;font-weight:700;color:var(--mute)}

/* 큰 숫자 증거 */
.nums{display:grid;gap:14px;margin-top:40px}
@media(min-width:760px){.nums{grid-template-columns:repeat(3,1fr);gap:18px}}
.num-card{border-radius:22px;padding:28px 24px;background:rgba(242,240,245,.07);box-shadow:inset 0 0 0 1px rgba(242,240,245,.14)}
.num-card .v{font-family:var(--it);font-style:italic;font-weight:900;font-size:clamp(72px,9vw,104px);line-height:.95;color:var(--paper)}
.num-card .v small{font-family:var(--kr);font-style:normal;font-size:.32em;font-weight:800;margin-left:6px}
.num-card p{margin-top:14px;font-size:16px;line-height:1.65}
.drench .ledger{border-top-color:var(--lilac)}
.drench .row{border-bottom-color:rgba(242,240,245,.12)}
.drench .row .how{color:var(--on-plum-2)}
.drench .row .tag{background:rgba(242,240,245,.12);color:var(--paper)}
.drench .ledger-note{color:var(--on-plum-2)}
.drench .route span{background:rgba(242,240,245,.08);box-shadow:inset 0 0 0 1px rgba(242,240,245,.18)}
.drench .route .ph{color:var(--lilac)}

/* 마지막 CTA */
.final{text-align:left;border-radius:32px;padding:48px 28px;position:relative;overflow:hidden}
@media(min-width:900px){.final{padding:80px 64px}}
.final .steps{right:32px;bottom:32px;top:auto;width:180px;height:100px}
.final .steps i{width:88px;height:56px}
.final .steps .s2{left:68px;bottom:28px;background:var(--paper)}
.final .cta .btn{background:var(--paper);color:var(--plum)}
.final .cta .btn.ghost{background:transparent;color:var(--paper);box-shadow:inset 0 0 0 1px rgba(242,240,245,.4)}

/* 끊임없이 흐르는 자료 띠 (페이지당 1회) */
.marq{overflow:hidden;border-block:1px solid var(--line);background:var(--white);padding:16px 0}
.marq-in{display:flex;gap:40px;width:max-content;font-weight:800;font-size:clamp(18px,2vw,22px);letter-spacing:-.03em;white-space:nowrap}
.marq-in span{display:inline-flex;align-items:center;gap:40px}
.marq-in span::after{content:"";width:22px;height:14px;background:var(--lilac);clip-path:polygon(38% 0,100% 0,62% 100%,0 100%)}
@media(prefers-reduced-motion:no-preference){.marq-in{animation:marq 38s linear infinite}@keyframes marq{to{transform:translateX(-50%)}}}

/* 섹션 진입: 이미 보이는 상태에서 살짝 떠오름 (JS가 켤 때만) */
.js .rise{opacity:0;transform:translateY(18px);transition:opacity .8s var(--ez),transform .8s var(--ez)}
.js .rise.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.js .rise{opacity:1;transform:none}}

/* 장부 구간 표시: 첫 성과 vs 그 이후 */
.era{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:44px;font-size:15px;font-weight:700}
.era b{background:var(--lilac);color:var(--plum-2);padding:4px 12px;border-radius:999px;font-size:14px}
.era + .ledger{margin-top:14px}
.after{margin-top:28px;padding:20px 22px;border-radius:16px;background:rgba(242,240,245,.08);box-shadow:inset 0 0 0 1px rgba(242,240,245,.18);font-size:16px;line-height:1.7}
.after b{color:var(--paper);font-size:18px}

.learn span,.learn b{text-wrap:pretty}

/* 클래스 신청서 */
.apply{max-width:720px}
.back{margin-bottom:12px}
.sum{display:grid;gap:0;margin-top:24px;background:var(--white);border-radius:18px;padding:4px 20px;box-shadow:0 1px 0 var(--line)}
.sum div,.bank div{display:grid;grid-template-columns:96px 1fr;gap:4px 12px;padding:14px 0;align-items:baseline}
.sum div+div,.bank div+div{border-top:1px solid var(--line)}
.sum span,.bank span{color:var(--mute);font-size:15px}
.sum b,.bank b{font-weight:700}
.sum small{grid-column:2;color:var(--mute);font-size:14px}
#apply-form{margin-top:32px;display:grid;gap:22px}
#apply-form .inputs{margin-top:0}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.sit{border:0;padding:0}
.sit legend{font-size:15px;color:var(--mute);font-weight:600;margin-bottom:8px}
.opts{display:flex;flex-wrap:wrap;gap:8px}
.opt input{position:absolute;opacity:0;pointer-events:none}
.opt span{display:inline-block;padding:10px 16px;border-radius:999px;background:var(--white);box-shadow:inset 0 0 0 1px #857A9B;font-size:15px;font-weight:600;cursor:pointer;transition:background .2s,color .2s}
.opt input:checked + span{background:var(--plum);color:var(--paper);box-shadow:none}
.opt input:focus-visible + span{outline:2px solid var(--plum);outline-offset:3px}
.consent{background:var(--paper-2);border-radius:16px;padding:18px 20px;font-size:15px;line-height:1.7;color:var(--mute)}
.consent b{color:var(--plum)}
.agree{display:flex;gap:10px;align-items:center;margin-top:12px;font-weight:700;color:var(--plum);cursor:pointer}
.agree input{width:22px;height:22px;accent-color:var(--plum)}
.form-err{color:#B3261E;font-weight:600;min-height:1em}
#apply-form .btn{justify-content:center;width:100%}
#apply-form .btn:disabled{opacity:.6;cursor:wait}
.done{margin-top:16px}
.done:focus{outline:none}
.bank{margin-top:24px;background:var(--white);border-radius:18px;padding:4px 20px;box-shadow:0 1px 0 var(--line)}
.bank b{font-size:19px}

[hidden]{display:none!important}

/* AI 실전 챌린지: 4주 구성 (발판처럼 올라가는 배치) */
.weeks{list-style:none;display:grid;gap:12px;margin-top:32px}
@media(min-width:900px){.weeks{grid-template-columns:repeat(4,1fr);align-items:end}
  .weeks li:nth-child(2){margin-bottom:20px}.weeks li:nth-child(3){margin-bottom:40px}.weeks li:nth-child(4){margin-bottom:60px}}
.weeks li{display:flex;flex-direction:column;gap:6px;background:var(--white);color:var(--plum);border-radius:20px;padding:22px 20px;box-shadow:0 1px 0 var(--line)}
.weeks .wk{font-family:var(--it);font-style:italic;font-weight:900;font-size:34px;line-height:1;color:var(--lilac)}
.weeks b{font-size:19px;font-weight:800;letter-spacing:-.035em;line-height:1.35}
.weeks li > span:not(.wk){color:var(--mute);font-size:15px;line-height:1.65}
.weeks em{font-style:normal;margin-top:auto;padding-top:10px;font-size:14px;font-weight:700;border-top:1px dashed var(--line-2)}
.drench .weeks li{background:rgba(242,240,245,.96)}
.weeks .wk small{font-family:var(--kr);font-style:normal;font-weight:800;font-size:.5em;margin-left:3px;letter-spacing:0}

/* 증빙 선택 */
.rc-box{display:grid;gap:12px;margin-top:14px;padding:16px;background:var(--paper-2);border-radius:16px}
.rc-box label{display:grid;gap:6px;font-size:15px;color:var(--mute);font-weight:600}
.rc-box input[type=file]{padding:10px;background:#fff;border:1px dashed #857A9B;border-radius:12px;font-size:15px}
.rc-box .meta{font-size:14px;color:var(--mute);line-height:1.6}

/* AI 자료: 업무 워크시트, 자료 묶음 제목 */
.tasks{display:grid;gap:12px;margin-top:16px}
.task{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:10px;background:var(--white);border-radius:18px;padding:18px 16px 16px;box-shadow:0 1px 0 var(--line);transition:box-shadow .3s}
.task.top{box-shadow:inset 0 0 0 2px var(--plum),0 12px 30px -20px rgba(58,46,82,.5)}
.task-n{position:absolute;right:14px;top:12px;font-family:var(--it);font-style:italic;font-weight:900;font-size:22px;color:var(--lilac)}
.task label{display:grid;gap:5px;font-size:14px;color:var(--mute);font-weight:600}
.task label:first-of-type{grid-column:1/-1;padding-right:28px}
.task select{padding:12px 10px;background:#fff;border:1px solid #857A9B;border-radius:12px;font:inherit;color:inherit;width:100%}
.task label:nth-of-type(4),.task label:nth-of-type(5){grid-column:1/-1}
@media(min-width:700px){.task{grid-template-columns:2fr 1fr 1fr 1.4fr 1.4fr;align-items:end}.task label:first-of-type,.task label:nth-of-type(4),.task label:nth-of-type(5){grid-column:auto}.task label:first-of-type{padding-right:0}.task-n{display:none}.task-score{grid-column:1/-1}}
.task-score{grid-column:1/-1;font-size:14px;font-weight:700;color:var(--plum);min-height:0}
.task-score:empty{display:none}
.pick{margin-top:18px;background:var(--plum);color:var(--paper);border-radius:20px;padding:22px 22px}
.pick b{font-size:14px;font-weight:700;color:var(--on-plum-2)}
.pick-name{font-size:24px;font-weight:800;letter-spacing:-.035em;margin-top:4px}
.pick-why{margin-top:8px;color:var(--on-plum-2);font-size:16px;line-height:1.7}
.grp{margin-top:56px}
.grp small{display:block;margin-top:6px;font-size:16px;font-weight:500;color:var(--mute);letter-spacing:-.01em}
.sh{font-size:clamp(26px,3vw,34px);font-weight:800;letter-spacing:-.035em;line-height:1.3}

/* ───────── 홈: 상황별 길 안내, 증거, 가로 자료 목록, 모바일 메뉴 ───────── */
.now{margin-top:20px;display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;color:var(--mute);font-size:15px;font-weight:600}
.now b{background:var(--plum);color:var(--paper);border-radius:999px;padding:3px 11px;font-size:14px;font-variant-numeric:tabular-nums}
.sh2{font-size:clamp(26px,3.2vw,36px);line-height:1.28;font-weight:800;letter-spacing:-.035em;text-wrap:balance}
.sh2 small{display:inline-block;margin-left:10px;font-size:.45em;font-weight:700;letter-spacing:0;color:var(--mute);vertical-align:.25em;background:var(--paper-2);border-radius:999px;padding:3px 11px}
.sec-h{align-items:flex-end}
section .lede{margin-top:12px}
.routes{list-style:none;margin-top:28px;border-top:1px solid var(--line-2)}
.routes a{display:grid;grid-template-columns:1fr auto;gap:6px 24px;align-items:center;padding:28px 4px;border-bottom:1px solid var(--line-2);text-decoration:none;transition:background .25s}
.routes a:hover,.routes a:focus-visible{background:rgba(251,250,252,.7)}
.routes .r-t{grid-column:1;font-size:clamp(20px,2.4vw,27px);font-weight:800;letter-spacing:-.035em;line-height:1.35}
.routes .r-d{grid-column:1;color:var(--mute);line-height:1.65}
.routes .r-go{grid-column:2;grid-row:1/3;display:inline-flex;align-items:center;gap:8px;font-weight:700;font-size:15px;white-space:nowrap}
.routes .r-go .ph{transition:transform .35s var(--ez)}
.routes a:hover .r-go .ph{transform:translateX(5px)}
@media(max-width:640px){.routes a{grid-template-columns:1fr}.routes .r-go{grid-column:1;grid-row:auto;margin-top:8px}}
.proof .proof-in{display:grid;gap:36px;align-items:start}
@media(min-width:900px){.proof .proof-in{grid-template-columns:1fr 1.05fr;gap:72px}}
.proof .route{margin-top:24px}
.more.light{color:var(--paper);margin-top:18px}
.proof .ledger{margin-top:0}
.ledger.mini .row{grid-template-columns:1fr auto}
.ledger.mini .how{grid-column:1/-1;grid-row:2}
.ledger.mini .row b{grid-row:1;grid-column:1}
.ledger.mini .amt{grid-row:1;grid-column:2}
.covers.rail{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:14px;margin:28px calc(var(--g) * -1) 0;padding:4px var(--g) 18px;scrollbar-width:none}
.covers.rail::-webkit-scrollbar{display:none}
.covers.rail .rcard{flex:0 0 64%;scroll-snap-align:start}
@media(min-width:640px){.covers.rail{display:grid;overflow:visible;margin:32px 0 0;padding:0}.covers.rail .rcard{flex:none}}
.burger{display:inline-grid;place-items:center;width:44px;height:44px;border:0;border-radius:50%;background:var(--white);box-shadow:inset 0 0 0 1px var(--line);cursor:pointer;color:var(--plum);flex:none}
.burger .ph{width:22px;height:22px}
.top .wrap{justify-content:flex-start}
.top .brand{margin-right:auto}
.top .gnb{margin-right:auto;margin-left:28px}
.top .brand{margin-right:0}
@media(min-width:760px){.burger{display:none}.msheet{display:none!important}}
@media(max-width:759px){.top .wrap{justify-content:space-between}.top .pill{margin-left:auto}}
.msheet{position:fixed;inset:0;z-index:4;background:var(--paper);padding:112px 0 40px;overflow:auto}
.msheet a:not(.btn){display:block;font-size:26px;font-weight:800;letter-spacing:-.04em;padding:16px 0;border-bottom:1px solid var(--line);text-decoration:none}
.msheet a[aria-current="page"]{color:var(--mute)}
.msheet .btn{display:flex;justify-content:center;width:100%;margin-top:14px}
.msheet .btn:first-of-type{margin-top:28px}
body.menu-open{overflow:hidden}

/* 하단 고정 바: 첫 화면 버튼이 보일 땐 숨김 */
.dock{transition:transform .45s var(--ez)}
.dock.late{transform:translateY(110%)}
body.menu-open .dock{display:none}
@media(max-width:520px){.hero .cta{display:grid;gap:10px}.hero .cta .btn{width:100%;justify-content:center}}

input[type=number]{width:100%;font:inherit;font-size:16px;color:var(--plum);background:var(--paper);border:1px solid #857A9B;border-radius:12px;padding:11px 14px;transition:border-color .2s,background .2s}
input[type=number]:focus{outline:none;border-color:var(--plum);background:#fff}
.task input[type=text],.task input[type=number]{background:#fff}
/* ───────── v5: 설득 구조(상세 페이지), 자료 목록 행, 검수 반영 ───────── */

/* 본문 글자는 16px 이상, 큰 화면에서는 설명이 한 단계 더 커요 */
.how,.rd,.rr-d,.rr-p,.cbody dl,.cbody dd small,.ledger-note,.meta,.refundline,.live,.facts span,.faq details p,.after,.lede,.sub{font-size:16px}
.rr-p{font-size:15.5px}
@media(min-width:900px){.lede,.faq details p,.facts span{font-size:18px}.hero p.sub{font-size:20px}.rr-d{font-size:17px}}
.weeks .wk{color:var(--plum)}
.weeks li > span:not(.wk){font-size:16px}
.thumb .when .ko{font-family:var(--kr);font-style:normal;font-weight:800;font-size:.55em;margin-left:2px;letter-spacing:0}

/* 첫 화면: 구체적인 제안을 버튼 위에 크게 */
.offer{margin-top:22px;display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;font-size:18px;font-weight:700;letter-spacing:-.02em}
.offer b{background:var(--plum);color:var(--paper);border-radius:999px;padding:3px 12px;font-size:15px;font-variant-numeric:tabular-nums}
.hero .cta{margin-top:20px}
@media(min-width:1100px){
  .upnext{display:grid;gap:6px;position:absolute;right:var(--g);top:128px;width:330px;padding:26px 26px 22px;background:var(--white);border-radius:22px;
    text-decoration:none;box-shadow:0 1px 0 var(--line),0 30px 60px -34px rgba(58,46,82,.5);transform:none;transition:box-shadow .4s var(--ez),transform .4s var(--ez)}
  .upnext:hover{transform:translateY(-3px);box-shadow:0 1px 0 var(--line),0 36px 64px -34px rgba(58,46,82,.55)}
  .upnext .un-s{justify-self:start;font-size:13px;font-weight:800;background:var(--plum);color:var(--paper);border-radius:999px;padding:3px 11px}
  .upnext .un-d{font-family:var(--it);font-style:italic;font-weight:900;font-size:64px;line-height:1;letter-spacing:-.04em;margin-top:6px}
  .upnext .un-d small{display:block;font-family:var(--kr);font-style:normal;font-size:16px;font-weight:600;letter-spacing:0;color:var(--mute);margin-top:8px}
  .upnext .un-t{font-size:20px;font-weight:800;letter-spacing:-.035em;margin-top:6px}
  .upnext .un-m{font-size:16px;color:var(--mute);line-height:1.6}
  .upnext .un-go{margin-top:12px;display:inline-flex;align-items:center;gap:8px;font-weight:700}
}
@media(max-width:1099px){.upnext{display:none}}
.hero .upnext strong{display:none}

/* 홈 길 안내: 계단 없이 한 줄씩 */

.grp3{font-size:18px;font-weight:800;letter-spacing:-.03em;margin:36px 0 4px}
.grp3:first-of-type{margin-top:28px}

/* 클래스 카드: 모집 중 하나만 강조 */
.ccard.open{box-shadow:inset 0 0 0 2px var(--plum),0 18px 40px -26px rgba(58,46,82,.5)}
.cbody .go{background:var(--paper)}
.cbody .go.solid{background:var(--plum);color:var(--paper)}
.ccard:hover .go.solid{background:var(--plum-2)}

/* 무료 자료 목록: 표지 그림 대신 실제 첫 항목을 보여주는 행 */
.resrows{list-style:none;margin-top:18px;border-top:1px solid var(--line-2)}
.resrows a{display:grid;grid-template-columns:1fr auto;gap:4px 20px;align-items:center;padding:22px 2px;border-bottom:1px solid var(--line-2);text-decoration:none;transition:background .25s}
.resrows a:hover{background:rgba(232,227,239,.5)}
.rr-t{grid-column:1;font-size:clamp(19px,2.2vw,23px);font-weight:800;letter-spacing:-.035em;line-height:1.35}
.rr-d{grid-column:1;color:var(--mute);line-height:1.65}
.rr-p{grid-column:1;margin-top:6px;padding:9px 12px;background:var(--white);border-radius:10px;color:var(--plum);font-weight:600;line-height:1.55;box-shadow:inset 0 0 0 1px var(--line)}
.rr-go{grid-column:2;grid-row:1/4;display:inline-flex;align-items:center;gap:8px;font-weight:700;font-size:15px;white-space:nowrap}
.rr-go .ph{transition:transform .35s var(--ez)}
.resrows a:hover .rr-go .ph{transform:translateX(5px)}
@media(max-width:640px){.resrows a{grid-template-columns:1fr}.rr-go{grid-column:1;grid-row:auto;margin-top:8px}}
.on-band .rr-p{background:var(--white)}

/* 이런 상황이라면: 후기가 아니라 상황과 우리가 하는 일을 짝지은 행 */
.ckrows{list-style:none;margin-top:22px;border-top:1px solid var(--line-2)}
.ckrows li{display:grid;grid-template-columns:28px 1fr;gap:14px;padding:20px 2px;border-bottom:1px solid var(--line-2);align-items:start}
.ckrows .ph{width:24px;height:24px;padding:4px;border-radius:50%;background:var(--plum);color:var(--paper);margin-top:3px}
.ckrows b{display:block;font-size:clamp(18px,2vw,21px);font-weight:800;letter-spacing:-.03em;line-height:1.4}
.ckrows span{display:block;color:var(--mute);margin-top:4px;line-height:1.65;font-size:16px}
@media(min-width:900px){.ckrows span{font-size:17px}}
.notfit{margin-top:24px;padding:18px 20px;background:var(--paper-2);border-radius:16px;line-height:1.75}
.on-band .notfit{background:var(--white)}

/* 프로그램 상세: 히어로 */
.phero{background:var(--plum);color:var(--paper);padding:56px 0 64px}
.phero .wrap{display:grid;gap:0}
.pdate{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 14px}
.pdate .pf{font-family:var(--it);font-style:italic;font-weight:900;font-size:clamp(72px,16vw,120px);line-height:1;letter-spacing:-.04em}
.pdate .pf .ko{font-family:var(--kr);font-style:normal;font-size:.45em;margin-left:4px}
.pdate small{font-size:17px;font-weight:600;color:var(--on-plum-2)}
.phero h1{margin-top:18px;font-family:var(--kr);font-weight:800;font-size:clamp(32px,6vw,56px);line-height:1.2;letter-spacing:-.04em;max-width:14em}
.phero .sub{margin-top:18px;color:var(--on-plum-2);max-width:30em;font-size:clamp(16px,1.6vw,19px);line-height:1.7}
.pfacts{display:grid;gap:0;margin-top:28px;border-top:1px solid rgba(242,240,245,.2);max-width:560px}
.pfacts div{display:grid;grid-template-columns:72px 1fr;gap:12px;padding:13px 0;border-bottom:1px solid rgba(242,240,245,.2);align-items:baseline}
.pfacts dt{color:var(--on-plum-2);font-size:15px}
.pfacts dd{font-weight:700;font-size:17px}
.pfacts small{display:block;font-weight:500;color:var(--on-plum-2);font-size:14px;margin-top:2px}
.phero .btn{background:var(--paper);color:var(--plum);margin-top:28px;justify-self:start}
.phero .btn:hover{background:#fff}
.live{margin-top:14px;min-height:1.6em;color:var(--on-plum-2);font-weight:600}

/* 프로그램 상세: 수업 구성 (번호가 큰 블록, 카드 없이 선으로만) */
.blocks{list-style:none;margin-top:28px;border-top:1px solid var(--line-2)}
.blocks > li{display:grid;grid-template-columns:64px 1fr;gap:18px;padding:26px 0;border-bottom:1px solid var(--line-2)}
.bn{font-family:var(--it);font-style:italic;font-weight:900;font-size:44px;line-height:1;color:var(--plum);letter-spacing:-.03em}
.blocks h3{font-size:clamp(20px,2.3vw,25px);font-weight:800;letter-spacing:-.035em;line-height:1.35}
.blocks ul{list-style:none;margin-top:10px;display:grid;gap:6px}
.blocks ul li{position:relative;padding-left:16px;color:var(--mute);line-height:1.65;font-size:16px}
.blocks ul li::before{content:"";position:absolute;left:2px;top:.8em;width:6px;height:6px;border-radius:50%;background:var(--lilac)}
@media(min-width:900px){.blocks ul li{font-size:17px}}

/* 신청 방법 4단계, 환불 기준 */
.steps4{list-style:none;margin-top:24px;counter-reset:s4;border-top:1px solid var(--line-2)}
.steps4 li{counter-increment:s4;display:grid;grid-template-columns:40px 1fr;gap:6px 16px;padding:20px 0;border-bottom:1px solid var(--line-2)}
.steps4 li::before{content:counter(s4);grid-row:1/3;display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--plum);color:var(--paper);font-weight:800;font-size:15px}
.steps4 b{font-size:19px;font-weight:800;letter-spacing:-.03em}
.steps4 span{color:var(--mute);line-height:1.7;font-size:16px}
.refund-box{margin-top:28px;padding:22px;background:var(--white);border-radius:20px;box-shadow:0 1px 0 var(--line)}
.refund-box h3{font-size:18px;font-weight:800;letter-spacing:-.03em}
.rf{display:grid;gap:0;margin-top:10px}
.rf div{display:flex;justify-content:space-between;gap:16px;padding:12px 0;border-bottom:1px solid var(--line);font-size:16px}
.rf div:last-child{border-bottom:0}
.rf b{font-weight:800;white-space:nowrap}
.refund-box p{margin-top:12px;color:var(--mute);line-height:1.7;font-size:16px}
.refundline{margin-top:14px;padding:14px 16px;background:var(--paper-2);border-radius:14px;line-height:1.7;color:var(--plum)}

/* 환불·개인정보 페이지 */
.legalpg{max-width:760px}
.legalpg .sh2{margin-top:44px;font-size:clamp(20px,2.4vw,26px)}
.legalpg p{margin-top:12px;line-height:1.85;font-size:17px}
.legalpg .meta{color:var(--mute);font-size:15.5px}
.legalpg .refund-box{margin-top:16px}

/* 이렇게 쓰세요 / 한 줄 목록 */
.usage{list-style:none;margin-top:20px;border-top:1px solid var(--line-2)}
.usage li{display:grid;gap:4px;padding:18px 0;border-bottom:1px solid var(--line-2)}
@media(min-width:760px){.usage li{grid-template-columns:200px 1fr;gap:24px;align-items:baseline}}
.usage b{font-weight:800;font-size:18px;letter-spacing:-.03em}
.usage span{color:var(--mute);line-height:1.7;font-size:16px}

/* 계약 기록: 금액은 숫자를 세리프 이탤릭으로 */
.amt{white-space:nowrap}
.amt .pf{font-family:var(--it);font-style:italic;font-weight:900;font-size:1.3em;letter-spacing:-.02em}
.amt i{font-style:normal;font-size:.8em;font-weight:700;margin-left:2px}
.lede.big{font-size:clamp(20px,2.6vw,26px);font-weight:700;letter-spacing:-.03em;line-height:1.55;color:var(--paper)}
.drench .route{margin-top:28px}
.drench .ledger{margin-top:28px}

/* 도약 장치는 첫 화면과 마지막 CTA에서만: 모바일에서는 버튼을 덮지 않게 숨김 */
@media(max-width:520px){.final .steps{display:none}}
.ramp{margin-top:56px}

/* 하단 고정 바: 단독 버튼 */
.dock.one a{flex:1}
.dock .a2{white-space:nowrap}

/* 하단 법적 링크 */
footer .legal{display:flex;gap:16px;flex-wrap:wrap}
footer .legal a{text-decoration:none;font-size:14px}

/* ───────── 2차 검수 반영 ───────── */
/* 플럼 배경 위에서 키보드 포커스가 보이게 */
.phero :focus-visible,.drench :focus-visible,.final :focus-visible,.msheet :focus-visible{outline-color:var(--paper)}

/* 띠 배경 섹션의 윗 여백을 되돌림 (홈의 첫 띠만 램프 아래에서 좁게) */
.on-band section:first-child{padding-top:72px}
@media(min-width:900px){.on-band section:first-child{padding-top:104px}}
.ramp + .on-band section:first-child{padding-top:24px}

/* 글자 크기 16px 이상 */
.pfacts dt,.pfacts small,.rr-go,.rr-p,.offer b,footer .legal a,.pfacts dd small{font-size:16px}
.pfacts small{font-size:15px}
footer .legal a{font-size:15px}

/* 자료 미리보기: 입력칸처럼 보이지 않게, 그냥 글자로 */
.rr-p{padding:0;background:none;box-shadow:none;border-radius:0;font-size:16px;color:var(--plum);font-weight:600;margin-top:8px}
.on-band .rr-p{background:none}

/* 계약까지의 흐름: 칩 대신 한 줄 글 */
.route{display:block;font-size:16px;font-weight:700;line-height:1.9;text-wrap:balance}
.route span{display:inline;background:none;box-shadow:none;padding:0}
.route .ph{display:inline;margin:0 8px;vertical-align:-.12em}

/* 마지막 CTA: 둥근 슬랩 대신 화면 끝까지 닿는 띠 */
section.wrap:has(> .final){max-width:none;padding-inline:0;padding-bottom:0;margin-top:24px}
.final{border-radius:0;padding:56px max(var(--g),calc((100vw - 1120px) / 2 + var(--g))) 64px}
@media(min-width:900px){.final{padding-block:88px 96px}}
.final.soon{margin-top:0}
.final .steps{right:max(var(--g),calc((100vw - 1120px) / 2 + var(--g)))}

/* 챌린지 4주: 카드 대신 수업 블록과 같은 줄 행 */
.weeks{display:block;margin-top:24px;border-top:1px solid var(--line-2)}
.weeks li{display:grid;grid-template-columns:64px 1fr;gap:18px;padding:24px 0;border-bottom:1px solid var(--line-2);background:none;border-radius:0;box-shadow:none;margin:0!important}
.weeks .wk{font-family:var(--it);font-style:italic;font-weight:900;font-size:44px;line-height:1;color:var(--plum)}
.weeks .wk small{font-family:var(--kr);font-style:normal;font-weight:800;font-size:.38em;margin-left:2px;letter-spacing:0}
.weeks b{display:block;font-size:clamp(19px,2.2vw,23px);font-weight:800;letter-spacing:-.035em;line-height:1.35}
.weeks div > span{display:block;color:var(--mute);margin-top:6px;line-height:1.65;font-size:16px}
.weeks em{display:block;margin-top:10px;font-style:normal;font-weight:700;font-size:16px;color:var(--plum)}
@media(min-width:900px){.weeks li{grid-template-columns:96px 1fr}.weeks div > span{font-size:17px}}

/* 홈: 서울·수원은 한 줄 행 */
.minirows{list-style:none;margin-top:14px;border-top:1px solid var(--line-2)}
.minirows a{display:grid;grid-template-columns:1fr auto;gap:2px 16px;align-items:center;padding:18px 2px;border-bottom:1px solid var(--line-2);text-decoration:none;transition:background .25s}
.minirows a:hover{background:rgba(232,227,239,.5)}
.minirows b{grid-column:1;font-size:18px;font-weight:800;letter-spacing:-.03em}
.minirows span{grid-column:1;color:var(--mute);font-size:16px}
.minirows i{grid-column:2;grid-row:1/3;font-style:normal;font-weight:700;font-size:15px;display:inline-flex;align-items:center;gap:6px;white-space:nowrap}
@media(max-width:560px){.minirows a{grid-template-columns:1fr}.minirows i{grid-column:1;grid-row:auto;margin-top:6px}}
.classes + .minirows{margin-top:20px}

/* 부산 상세: 만든 사람 서명, 데스크톱 히어로 오른쪽 */
.sign{margin-top:22px;font-weight:700;line-height:1.7;color:var(--paper)}
.sign{font-size:16px}
.ptake{display:none}
@media(min-width:1000px){
  .phero .wrap{grid-template-columns:minmax(0,1fr) 400px;column-gap:72px;align-items:start}
  .phero .wrap > *{grid-column:1}
  .phero .wrap > .ptake{display:block;grid-column:2;grid-row:1/9;align-self:center;padding:0}
  .ptake h2{font-size:18px;font-weight:800;letter-spacing:-.03em;color:var(--on-plum-2);padding-bottom:12px;border-bottom:1px solid rgba(242,240,245,.25)}
  .ptake ul{list-style:none}
  .ptake li{padding:18px 0;border-bottom:1px solid rgba(242,240,245,.2)}
  .ptake b{display:block;font-size:20px;font-weight:800;letter-spacing:-.03em}
  .ptake span{display:block;color:var(--on-plum-2);margin-top:3px;font-size:16px}
}
.ptake h2{max-width:none;width:100%}