/* PUB-01 베리북스란 — 피그마 2026-10-23 사본(2sGq) 에서 바뀐 곳 · pub-landing-1022.css 뒤에 부름
   히어로 장면 · 숫자 카드 4개 · 걸어온 길 글 · Point 01 · 02 화면 예시 · 독서인증서(새 섹션) · 탭 켜짐(학부모 · 기관) · 퀵 메뉴 호버
   값은 피그마 그대로(1440 기준) — 좁은 화면은 맨 아래 @media */

/* Hero (1878:9187) — 하늘 · 언덕 장면(원본 3168×1344 → 높이 776) · 짙은 글 */
.lv-hero { background: #d7ebf3; }
.lv-hero__scene { position: absolute; left: calc(50% + 167.5px); top: 0; width: 1829px; height: 776px; max-width: none; object-fit: cover; transform: translateX(-50%); pointer-events: none; }
.lv-hero__text { padding-top: 178px; }
.lv-hero__eyebrow { margin-left: -71px; font-size: 38px; font-weight: 500; line-height: 57px; letter-spacing: -2.09px; color: #3a3b36; }
.lv-hero__title { margin: 5px 0 0 -71px; font-size: 70px; font-weight: 600; line-height: 88px; letter-spacing: -2.8px; color: #3a3b36; }
.lv-hero__title em { font-style: normal; color: #2e9a57; }
.lv-hero__butterfly { position: absolute; left: calc(50% + 396px); top: 280px; width: 87px; height: 87px; pointer-events: none; }

/* 숫자 카드 4개 (1878:9199) — 숫자 73 · 옆에 「+」 위 · 단위 아래 */
.lv-stats--4 { grid-template-columns: repeat(4, 299.25px); }
.lv-stats--4 .lv-stat__value { right: 20px; bottom: 22.5px; align-items: stretch; }
.lv-stats--4 .lv-stat__value strong { font-size: 73px; line-height: 87px; letter-spacing: -3.65px; }
.lv-stats--4 .lv-stat__side { display: flex; flex-direction: column; justify-content: flex-end; margin-left: 2px; padding: 14px 0 5.5px; }
.lv-stats--4 .lv-stat__side b { position: static; margin-bottom: auto; font-size: 24px; font-weight: 700; line-height: 24px; color: #1b1b1b; }
.lv-stats--4 .lv-stat__side span { margin-left: 0; font-size: 18px; font-weight: 400; line-height: 21px; letter-spacing: -0.9px; color: #4a4b45; }

/* 걸어온 길 (1878:9237) — 글은 위에서 72 */
.lv-year { justify-content: flex-start; padding-top: 72px; }

/* Point 01 · 02 화면 예시 (1960:24 · 1960:2) — 실제 문항 카드 */
.lv-shot--qa { height: 556px; border-radius: 28px; background: linear-gradient(135.71deg, #f6fbf2 0%, #e6f6ea 42.857%, #dcf2e6 71.429%); }
.lv-qa { position: absolute; display: flex; flex-direction: column; justify-content: center; gap: 16px; padding: 0 28px; box-sizing: border-box; overflow: hidden; border-radius: 22px; background: #fff; }
.lv-qa--back { left: 30px; top: 30px; width: 420px; height: 330px; box-shadow: 0 12px 30px rgba(15,56,31,0.06), 0 2px 6px rgba(15,56,31,0.04); }
.lv-qa--front { left: 100px; top: 280px; width: 440px; height: 246px; box-shadow: 0 22px 50px rgba(15,56,31,0.14), 0 2px 6px rgba(15,56,31,0.06); }
.lv-qa__head { display: flex; align-items: center; gap: 10px; white-space: nowrap; }
.lv-qa__chip { display: inline-flex; align-items: center; height: 35px; padding: 0 16px; border-radius: 999px; background: #edf7ef; font-size: 16.1px; font-weight: 600; line-height: 22px; letter-spacing: -0.644px; color: #2e9a57; }
.lv-qa__chip--on { background: #2e9a57; color: #fff; }
.lv-qa__book { font-size: 16.1px; font-weight: 500; line-height: 22px; letter-spacing: -0.644px; color: #6b766f; }
.lv-qa__q { font-size: 18.4px; font-weight: 500; line-height: 30px; letter-spacing: -0.736px; color: #4a4b45; white-space: nowrap; }
.lv-qa__q b { font-weight: 700; color: #2e9a57; }
.lv-qa__choices { display: flex; flex-direction: column; gap: 10px; }
.lv-qa__choices li { display: flex; align-items: center; gap: 12px; }
.lv-qa__choices span { display: flex; align-items: center; justify-content: center; width: 24px; height: 24px; box-sizing: border-box; border: 1.5px solid #cfe5d6; border-radius: 12px;
    font-size: 13px; font-weight: 600; line-height: 16px; color: #9aa69f; }
.lv-qa__choices i { display: block; height: 10px; border-radius: 5px; background: #eef3ef; }
.lv-qa__input { display: flex; align-items: center; height: 52px; padding-left: 18px; box-sizing: border-box; border: 1px solid #e3ece6; border-radius: 14px; background: #f5f8f6;
    font-size: 16.1px; font-weight: 500; line-height: 22px; letter-spacing: -0.644px; color: #9aa69f; }

.lv-shot--lv { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; gap: 14px; padding: 30px; box-sizing: border-box;
    background: linear-gradient(135.71deg, #f4f9ff 0%, #e3effb 42.857%, #dfe9fb 71.429%); }
.lv-lv__label { display: inline-flex; align-items: center; height: 35px; padding: 0 16px; border-radius: 999px; background: #fff;
    font-size: 16.1px; font-weight: 600; line-height: 22px; letter-spacing: -0.644px; color: #4580c4; white-space: nowrap; }
.lv-lv__label b { font-weight: 700; }
.lv-lv { display: flex; flex-direction: column; gap: 16px; width: 100%; padding: 28px; box-sizing: border-box; border-radius: 22px; background: #fff;
    box-shadow: 0 16px 40px rgba(21,48,79,0.09), 0 2px 6px rgba(21,48,79,0.05); }
.lv-lv__head { display: flex; align-items: center; gap: 12px; white-space: nowrap; }
.lv-lv__v { display: inline-flex; align-items: center; justify-content: center; min-width: 52px; height: 35px; padding: 0 16px; box-sizing: border-box; border-radius: 999px; background: #eaf2fb;
    font-size: 16.1px; font-weight: 700; line-height: 22px; letter-spacing: -0.644px; color: #4580c4; }
.lv-lv__v--on { background: #4580c4; color: #fff; }
.lv-lv__who { font-size: 16.1px; font-weight: 600; line-height: 22px; letter-spacing: -0.644px; color: #4a4b45; }
.lv-lv__kind { margin-left: auto; font-size: 16.1px; font-weight: 500; line-height: 22px; letter-spacing: -0.644px; color: #6b766f; }
.lv-lv__q { font-size: 18.4px; font-weight: 500; line-height: 30px; letter-spacing: -0.736px; color: #4a4b45; }
.lv-lv__q b { font-weight: 700; color: #4580c4; }
.lv-lv__link { display: flex; align-items: center; gap: 10px; padding-left: 32px; font-size: 16.1px; font-weight: 600; line-height: 22px; letter-spacing: -0.644px; color: #4580c4; white-space: nowrap; }
.lv-lv__link::before { content: ""; width: 2px; height: 22px; border-radius: 2px; background: #cfe3f6; }

/* 함께 쓰는 사람들 — 학부모 · 기관 탭 켜짐 (1907:36 · 1907:99) — 설명 글 16.4 · 그림 자리 */
.lv-tab__desc--sm { font-size: 16.4px; line-height: 25px; letter-spacing: -0.656px; }
.lv-char__img--parent { left: 59px; top: 65.5px; width: 478px; height: 357px; }
.lv-char__img--org { left: 92px; top: 97.5px; width: 419px; height: 313px; }

/* 퀵 메뉴 호버 (1911:3 · 26 · 49) — 펼치면 왼쪽 22 · 오른쪽 16 · 글과 아이콘 사이 16 */
.lv-quick__btn { gap: 16px; }
.lv-quick__btn:hover, .lv-quick__btn:focus-visible { padding: 0 16px 0 22px; }

/* 독서인증서 (1977:2) */
.lv-cert { position: relative; height: 776px; overflow: hidden; background: linear-gradient(162.79deg, #2b7a4b 0%, #1f6b40 40.146%, #14502e 72.993%); }
.lv-cert__light { position: absolute; left: calc(50% - 550px); top: 180px; width: 1100px; height: 620px; max-width: none; pointer-events: none; }
.lv-cert__inner { position: relative; display: flex; flex-direction: column; align-items: center; padding-top: 75px; text-align: center; }
/* 칩 — 피그마는 너비 36 고정이라 글이 잘려 보임(디자이너 확인) · 글 길이에 맞춤 */
.lv-cert__chip { display: inline-flex; align-items: center; height: 35px; padding: 0 18px; border-radius: 999px; background: rgba(255,255,255,0.14);
    font-size: 16.1px; font-weight: 600; line-height: 22px; letter-spacing: -0.644px; color: #c9f5d8; white-space: nowrap; }
.lv-cert__title { margin-top: 18px !important; font-size: 56px; font-weight: 700; line-height: 76px; letter-spacing: -2.8px; color: #fff; white-space: nowrap; }
.lv-cert__desc { margin-top: 16px !important; font-size: 18.4px; font-weight: 500; line-height: 30px; letter-spacing: -0.736px; color: rgba(255,255,255,0.86); white-space: nowrap; }
.lv-cert__art { position: relative; width: 620px; height: 378px; margin-top: 44px; }
.lv-cert__laurel { position: absolute; top: -5px; width: 172px; height: 361px; border-radius: 12px; background: rgba(143,221,176,0.25); box-shadow: 0 12px 19px rgba(5,41,23,0.35); }
.lv-cert__laurel--l { left: -151px; }
.lv-cert__laurel--r { left: 599px; }
.lv-cert__paper { position: absolute; inset: 0; overflow: hidden; border-radius: 5px; background: #fff; box-shadow: 0 26px 60px rgba(5,41,23,0.35); text-align: center; }
.lv-cert__line1 { position: absolute; left: 12px; top: 12px; width: 596px; height: 354px; box-sizing: border-box; border: 1.7px solid #2e9a57; border-radius: 2px; }
.lv-cert__line2 { position: absolute; left: 18px; top: 18px; width: 584px; height: 342px; box-sizing: border-box; border: 0.9px solid #b7dcc4; }
.lv-cert__corner { position: absolute; width: 22px; height: 22px; }
.lv-cert__no { position: absolute; left: 34px; top: 29px; font-size: 10.8px; font-weight: 500; line-height: 15px; color: #6b766f; white-space: nowrap; }
.lv-cert__body { position: absolute; left: 92px; top: 57.5px; width: 436px; display: flex; flex-direction: column; align-items: center; }
.lv-cert__name { padding-left: 15.12px; font-size: 36px; font-weight: 700; line-height: 45px; letter-spacing: 15.12px; color: #1f6b40; white-space: nowrap; }
.lv-cert__who { display: flex; align-items: baseline; gap: 14px; margin-top: 19px !important; white-space: nowrap; }
.lv-cert__who span { font-size: 13.8px; font-weight: 600; line-height: 20px; letter-spacing: -0.552px; color: #6b766f; }
.lv-cert__who b { font-size: 22.4px; font-weight: 700; line-height: 30px; letter-spacing: 2.688px; color: #3b3d38; }
.lv-cert__text { margin-top: 15px !important; font-size: 13.3px; font-weight: 500; line-height: 23px; letter-spacing: -0.532px; color: #4a4b45; white-space: nowrap; }
.lv-cert__date { margin-top: 14px !important; font-size: 11.2px; font-weight: 600; line-height: 16px; letter-spacing: -0.448px; color: #4a4b45; }
.lv-cert__sign { position: relative; width: 125.071px; height: 56px; margin-top: 22px; }
.lv-cert__logo { position: absolute; left: 0; top: 17.7px; width: 125.071px; height: 20.6px; background: #228a4f;
    -webkit-mask: url(../images/landing-1023/cert-logo-mask.png) no-repeat 0 0 / 125.072px 20.6px; mask: url(../images/landing-1023/cert-logo-mask.png) no-repeat 0 0 / 125.072px 20.6px; }
.lv-cert__stamp { position: absolute; left: 140.2px; top: -3.55px; width: 55px; height: 55px; transform: rotate(-7deg); }
.lv-cert__stamp img { position: absolute; left: 1.3px; top: 1.3px; width: 52.4px; height: 52.4px; }
.lv-cert__stamp b { position: absolute; font-size: 14.5px; font-weight: 700; line-height: normal; color: rgba(211,58,44,0.9); }
.lv-cert__stamp b:nth-of-type(1) { left: 14px; top: 13px; }
.lv-cert__stamp b:nth-of-type(2) { left: 29px; top: 13px; }
.lv-cert__stamp b:nth-of-type(3) { left: 14px; top: 29px; }
.lv-cert__stamp b:nth-of-type(4) { left: 29px; top: 29px; }

/* 좁은 화면 (디자인은 1440 하나라 개발 판단 · pub-landing-1022.css 와 같은 기준) */
@media (max-width: 1279px) {
    .lv-hero__eyebrow, .lv-hero__title { margin-left: 0; }
    .lv-hero__text { padding: 178px 0 120px; }
    .lv-hero__butterfly { display: none; }
    .lv-stats--4 { grid-template-columns: repeat(2, 1fr); }
    .lv-cert { height: auto; padding-bottom: 80px; }
    .lv-cert__title, .lv-cert__desc { padding: 0 20px; white-space: normal; }
}
@media (max-width: 767px) {
    .lv-hero__text { padding: 120px 0 200px; }
    .lv-hero__eyebrow { font-size: 24px; line-height: 36px; }
    .lv-hero__title { font-size: 36px; line-height: 48px; }
    .lv-cert__title { font-size: 32px; line-height: 44px; letter-spacing: -1.2px; }
    .lv-cert__laurel { display: none; }
    .lv-cert__art { transform: scale(0.52); transform-origin: top center; margin-bottom: -181px; }
}