/* 2026-11-12 멘탈리에 7일 웹강의 DAY 1 — 레이블현 무료신청 페이지(style-a) 톤을 그대로 잇는 강의 전용 부품
   흰 지면 · 마루부리 명조 · 노란 형광펜 · 주황 강조 · 미색 판 */

/* 맨 위 읽기 진행 막대 */
.lx-progress{position:fixed;left:0;top:0;z-index:30;height:3px;width:100%;background:transparent;pointer-events:none}
.lx-progress i{display:block;height:100%;width:100%;background:var(--accent);transform-origin:0 50%;transform:scaleX(var(--read,0))}

/* 첫 화면: 강의 표지 */
.a-hero .a-kicker{display:inline-flex;align-items:center;gap:10px}
.lx-day{display:inline-block;padding:4px 10px;border-radius:99px;background:var(--yellow);color:#111;font-weight:700;letter-spacing:.06em}
.a-hero h1.a-big{font-size:clamp(28px,6.6vw,54px)}
.lx-meta{display:flex;flex-wrap:wrap;gap:8px 16px;margin:22px 0 0;padding:0;list-style:none;font-size:14px;opacity:.88}
.lx-meta li::before{content:"· ";opacity:.6}
.lx-meta li:first-child::before{content:none}
.hero-cue{display:inline-flex;align-items:center;gap:8px;margin-top:28px;padding:13px 20px;border-radius:99px;background:var(--yellow);color:#111;font-weight:700;font-size:15px;text-decoration:none}

/* 본문 속 짧은 한 줄(대사·시간) */
.a-text .lx-line{font-family:M,serif;font-weight:700;font-size:clamp(20px,2.7vw,24px);line-height:1.6}
.a-text .lx-time{font-family:M,serif;font-weight:700;font-size:clamp(44px,12vw,72px);line-height:1.1;letter-spacing:-.02em;color:var(--accent);margin:.5em 0}
.a-text .a-voice{margin:1.6em 0}
.a-text .a-voice p{margin:0;font-size:inherit;line-height:inherit}

/* 한마디로 정리하면: 두 처방 비교 */
.lx-sum{margin:1.6em 0;padding:26px 20px 22px;background:var(--paper);border-radius:16px}
.lx-sum-title{margin:0 0 16px!important;font-family:M,serif;font-weight:700;font-size:clamp(19px,2.6vw,22px)!important;text-align:center}
.lx-sum-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.lx-sum-card{padding:18px 14px;border-radius:12px;background:#fff}
.lx-sum-card small{display:block;margin:0 0 8px;font-size:12.5px;font-weight:700;letter-spacing:.04em;color:var(--muted)}
.lx-sum-card p{margin:0!important;font-size:15.5px!important;line-height:1.65!important}
.lx-sum-card.is-old p{color:#777;text-decoration:line-through;text-decoration-color:rgba(221,51,51,.7);text-decoration-thickness:1.5px}
.lx-sum-card.is-new{background:var(--black);color:#fff}
.lx-sum-card.is-new small{color:var(--yellow)}
.lx-sum-card.is-new b{color:var(--yellow)}
@media(max-width:420px){.lx-sum-grid{grid-template-columns:1fr}}

/* 큰 문장 아래 작은 출처 줄 */
.a-type .lx-src{margin:22px 0 0;font-size:14px;color:var(--muted)}
.a-type.a-dark .lx-src{color:#aaa}
.a-type>div{max-width:900px}

/* 세 가지 매듭 카드 (4개의 자유 카드와 같은 결) */
.lx-knots .a-freedom-card h3{margin-bottom:8px}
.lx-knots .lx-knot-sub{margin:0 0 22px;font-family:M,serif;font-size:clamp(16px,2.2vw,19px);line-height:1.6;color:var(--accent)}
.lx-knots .a-freedom-card p{margin:0 0 1em;font-size:clamp(17.5px,2.2vw,20px);line-height:1.85}
.lx-knots .a-freedom-card p:last-child{margin-bottom:0}
.lx-knots .a-freedom-card strong{box-shadow:inset 0 -.4em var(--hl)}
.lx-knot-meter{display:flex;gap:8px;margin:20px 0 0;font-size:13.5px}
.lx-knot-meter span{flex:1;padding:10px 12px;border-radius:10px;background:var(--paper);line-height:1.45}
.lx-knot-meter b{display:block;font-family:M,serif;font-size:22px;color:var(--ink)}
.lx-knot-meter span.is-burn b{color:var(--accent)}

/* 도식 */
.lx-figure{max-width:640px;margin:0 auto;padding:0 20px}
.lx-figure+.a-text{padding-top:7vh}
.lx-figure figure{margin:0}
.lx-figure img{width:100%;border-radius:16px;box-shadow:0 18px 40px rgba(0,0,0,.12)}
.lx-figure figcaption{margin:12px 0 0;text-align:center;font-size:13px;color:var(--muted)}

/* 오늘의 실습 */
.lx-practice{background:var(--paper);padding:12vh 20px}
.lx-practice-head{max-width:640px;margin:0 auto 6vh;text-align:center}
.lx-practice-head .m4-pill{margin:0 0 14px}
.lx-practice-head h2{margin:0 0 18px;font-family:M,serif;font-size:clamp(26px,5.4vw,40px);line-height:1.4}
.lx-practice-head p{margin:0 0 .8em;font-size:clamp(17px,2.2vw,19px);line-height:1.85}
.lx-practice-head strong{box-shadow:inset 0 -.4em var(--hl)}
.lx-practice .a-steps{max-width:640px;margin:0 auto 7vh}
.lx-practice .a-steps li b{display:block;margin:0 0 4px;font-family:M,serif;font-size:19px}
.lx-map{max-width:560px;margin:0 auto;background:#fff;border-radius:16px;padding:28px 20px 22px;box-shadow:0 24px 70px rgba(0,0,0,.14)}
.lx-map-title{margin:0 0 6px;font-family:M,serif;font-size:clamp(20px,4.4vw,24px);line-height:1.45;text-align:center}
.lx-map-desc{margin:0 0 18px;font-size:14px;line-height:1.6;color:#555;text-align:center}
.lx-example{margin:0 0 20px;padding:12px 14px;border:1px dashed #d9cdb6;border-radius:10px;background:#fffcf5;font-size:14px;line-height:1.6;color:#555}
.lx-example b{color:var(--ink)}
.lx-field{margin:0 0 16px}
.lx-field>label,.lx-field>legend{display:block;margin:0 0 8px;padding:0;font-size:13.5px;font-weight:700}
.lx-field>legend small,.lx-field>label small{font-weight:500;color:var(--muted)}
fieldset.lx-field{border:0;padding:0;min-width:0}
.lx-chips{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.lx-chips label{position:relative;display:block;cursor:pointer}
.lx-chips input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer}
.lx-chips span{display:block;padding:13px 6px;border:1px solid #e3d8c3;border-radius:10px;background:#fffcf5;text-align:center;font-size:15px;font-weight:700;line-height:1.3;transition:background .2s,color .2s,border-color .2s}
.lx-chips span small{display:block;margin-top:2px;font-size:11.5px;font-weight:500;color:var(--muted)}
.lx-chips input:checked+span{background:#141414;border-color:#141414;color:var(--yellow)}
.lx-chips input:checked+span small{color:#ddd}
.lx-chips input:focus-visible+span{outline:2px solid var(--accent);outline-offset:2px}
.lx-field textarea{width:100%;min-height:84px;padding:12px;border:1px solid #e3d8c3;border-radius:8px;background:#fffcf5;font:inherit;font-size:16px;line-height:1.6;resize:vertical}
.lx-field textarea:focus{outline:2px solid var(--ink);outline-offset:1px}
.lx-save{display:block;width:100%;padding:17px 14px;border:0;border-radius:8px;background:#141414;color:var(--yellow);font:700 16.5px/1.4 P,sans-serif;cursor:pointer}
.lx-save::after{content:" ›"}
.lx-status{min-height:1.6em;margin:10px 0 0;font-size:13.5px;color:#b45309;text-align:center}
.lx-saved-note{margin:6px 0 0;font-size:11.5px;color:#999;text-align:center;line-height:1.6}
.lx-tips{max-width:560px;margin:22px auto 0;display:grid;gap:10px}
.lx-tip{margin:0;padding:16px 18px;border-radius:12px;background:#fff;font-size:15px;line-height:1.75}
.lx-tip b{display:block;margin:0 0 2px}

/* 다음 날 예고 */
.lx-next{display:inline-block;margin:0 0 14px;padding:6px 12px;border-radius:99px;background:var(--black);color:var(--yellow);font-size:13px;font-weight:700;letter-spacing:.04em}
.a-text .lx-closing{margin-top:2em;padding:26px 24px;border-radius:16px;background:var(--black);color:#fff;font-family:M,serif;font-size:clamp(19px,2.6vw,23px);line-height:1.8}
.a-text .lx-closing em{color:var(--yellow);font-weight:700}

/* 하단 고정 바 */
.sticky-cta-button{white-space:nowrap}
footer{padding-bottom:110px}