@charset "UTF-8";
/* =========================================================
   눈금 · NUNGEUM — 한국 시장 독해 학습 커뮤니티
   밝은 종이 톤 기반. 짙은 색은 푸터·티켓 스텁 등 강조에만.
   ========================================================= */

:root{
  --paper:      #F2EDE3;
  --paper-hi:   #FCFAF5;
  --paper-2:    #E9E2D4;
  --board:      #123830;
  --board-2:    #0B241F;
  --board-3:    #071A16;
  --ink:        #16201C;
  --ink-2:      #46524B;
  --ink-3:      #78837C;
  --line:       rgba(22,32,28,.12);
  --line-2:     rgba(22,32,28,.07);
  --verm:       #E0512A;
  --verm-hi:    #FF7448;
  --verm-deep:  #BE3D19;
  --brass:      #A8863F;
  --brass-hi:   #C9A45C;

  --f-disp: "Nanum Myeongjo", "Nanum Gothic", serif;
  --f-body: "IBM Plex Sans KR", "Apple SD Gothic Neo", "Malgun Gothic", sans-serif;
  --f-mono: "IBM Plex Mono", ui-monospace, monospace;

  --r: 10px;
  --shadow: 0 26px 56px -32px rgba(30,22,10,.4);
}

*,*::before,*::after{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; scroll-behavior:smooth; }

body{
  margin:0;
  padding-bottom:104px;
  font-family:var(--f-body);
  font-size:16px;
  line-height:1.85;
  color:var(--ink-2);
  background:var(--paper);
  -webkit-font-smoothing:antialiased;
  overflow-x:hidden;
  word-break:keep-all;      /* 한국어 어절 단위 줄바꿈 */
}
body.is-locked{ overflow:hidden; }

body::before{
  content:"";
  position:fixed; inset:0; z-index:1; pointer-events:none;
  opacity:.07; mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3'/></filter><rect width='180' height='180' filter='url(%23n)' opacity='.5'/></svg>");
}

img{ max-width:100%; display:block; }
a{ color:inherit; }
.wrap{ width:100%; max-width:1220px; margin:0 auto; padding:0 clamp(20px,5vw,44px); position:relative; z-index:2; }
::selection{ background:var(--verm); color:#fff; }
:focus-visible{ outline:2px solid var(--verm); outline-offset:3px; }

.reveal{
  opacity:0; transform:translateY(20px);
  transition:opacity .8s cubic-bezier(.22,.9,.26,1), transform .8s cubic-bezier(.22,.9,.26,1);
  transition-delay:var(--d,0s);
}
.reveal.is-in{ opacity:1; transform:none; }

/* ---------------------------------------------------------
   시그니처 · 눈금 레일
   --------------------------------------------------------- */
.rail{ position:fixed; left:0; top:0; bottom:0; width:70px; z-index:40; pointer-events:none; display:none; }
.rail__line{
  position:absolute; left:20px; top:0; bottom:0; width:24px;
  background-image:
    repeating-linear-gradient(to bottom, rgba(22,32,28,.16) 0 1px, transparent 1px 13px),
    repeating-linear-gradient(to bottom, rgba(168,134,63,.6) 0 1px, transparent 1px 65px);
  background-size:9px 100%, 21px 100%;
  background-repeat:no-repeat; background-position:left top, left top;
}
.rail__needle{
  position:absolute; left:14px; top:0; height:2px; width:34px;
  background:var(--verm); box-shadow:0 0 12px 1px rgba(224,81,42,.55);
  transform:translateY(-1px); transition:top .12s linear;
}
.rail__needle::after{ content:""; position:absolute; right:-5px; top:-3px; border:4px solid transparent; border-right-color:var(--verm); }
.rail__read{ position:absolute; left:2px; top:-19px; font-family:var(--f-mono); font-size:10px; font-weight:600; letter-spacing:.08em; color:var(--verm-deep); }
.rail__lab{
  position:absolute; left:44px;
  font-family:var(--f-mono); font-size:10px; letter-spacing:.1em;
  color:rgba(22,32,28,.3); white-space:nowrap;
  transform-origin:left center; transform:rotate(90deg) translateY(-50%);
  transition:color .3s;
}
.rail__lab.is-on{ color:var(--brass); }

.railtop{
  position:fixed; left:0; right:0; top:0; height:3px; z-index:45;
  background-image:repeating-linear-gradient(to right, rgba(22,32,28,.16) 0 1px, transparent 1px 22px);
  background-color:rgba(22,32,28,.07);
}
.railtop__fill{ display:block; height:100%; width:0; background:linear-gradient(90deg,var(--verm-deep),var(--verm-hi)); }

/* ---------------------------------------------------------
   타이포 공통
   --------------------------------------------------------- */
.eyebrow{
  display:inline-flex; align-items:center; gap:10px; margin:0 0 20px;
  font-family:var(--f-mono); font-size:11px; font-weight:500;
  letter-spacing:.14em; text-transform:uppercase; color:var(--ink-3);
}
.eyebrow__tick{ width:26px; height:9px; flex:none; background-image:repeating-linear-gradient(to right, var(--verm) 0 1.5px, transparent 1.5px 5px); }
.eyebrow--center{ justify-content:center; }

.shead{ max-width:640px; margin:0 0 clamp(32px,4.2vw,50px); }
.shead__title{
  margin:0 0 16px;
  font-family:var(--f-disp); font-weight:800;
  font-size:clamp(1.85rem,4.2vw,2.95rem);
  line-height:1.28; letter-spacing:-.02em; color:var(--ink);
}
.shead__title em{ font-style:normal; position:relative; color:var(--verm-deep); white-space:nowrap; }
.shead__title em::after{
  content:""; position:absolute; left:0; right:0; bottom:-7px; height:7px;
  background-image:repeating-linear-gradient(to right, var(--brass) 0 1.5px, transparent 1.5px 6px);
  opacity:.8;
}
.shead__sub{ margin:0; font-size:clamp(.94rem,1.5vw,1.02rem); color:var(--ink-2); line-height:1.9; max-width:54ch; }

/* ---------------------------------------------------------
   버튼
   --------------------------------------------------------- */
.btn{
  position:relative; isolation:isolate; overflow:hidden;
  display:inline-flex; align-items:center; justify-content:center; gap:11px;
  border:0; cursor:pointer; text-decoration:none;
  font-family:var(--f-body); font-weight:700; letter-spacing:-.01em;
  border-radius:8px;
  transition:transform .28s cubic-bezier(.22,.9,.26,1), box-shadow .28s;
}
.btn::before{
  content:""; position:absolute; z-index:2; inset:0;
  background:linear-gradient(104deg, transparent 24%, rgba(255,255,255,.55) 46%, rgba(255,255,255,.05) 58%, transparent 72%);
  transform:translateX(-130%);
  animation:sheen 4.6s cubic-bezier(.5,0,.3,1) infinite;
  pointer-events:none;
}
@keyframes sheen{ 0%,62%{ transform:translateX(-130%); } 92%,100%{ transform:translateX(130%); } }
.btn:hover{ transform:translateY(-2px); }
.btn:active{ transform:translateY(0); }
.btn__ico{ width:22px; height:22px; flex:none; border-radius:5px; background-size:cover; background-position:center; box-shadow:0 1px 4px rgba(0,0,0,.24); }
.btn i{ font-size:.92em; }

.btn--sm{ padding:11px 18px; font-size:.86rem; }
.btn--sm .btn__ico{ width:18px; height:18px; }
.btn--lg{ padding:16px 28px; font-size:1rem; }
.btn--xl{ padding:20px 40px; font-size:1.08rem; }

.btn--kakao{
  color:#FFF4EC;
  background:linear-gradient(178deg, #F0602F 0%, #D8441C 62%, #C03A16 100%);
  box-shadow:0 0 0 1px rgba(255,180,140,.3) inset, 0 1px 0 rgba(255,255,255,.35) inset, 0 14px 28px -14px rgba(190,61,25,.75);
}
.btn--kakao::after{
  content:""; position:absolute; inset:-2px; z-index:-1; border-radius:inherit;
  background:radial-gradient(60% 120% at 50% 50%, rgba(255,116,72,.6), transparent 70%);
  filter:blur(9px); opacity:.7; animation:halo 3.4s ease-in-out infinite;
}
@keyframes halo{ 0%,100%{opacity:.4;} 50%{opacity:.9;} }
.btn--kakao:hover{ box-shadow:0 0 0 1px rgba(255,180,140,.45) inset, 0 18px 34px -14px rgba(190,61,25,.95); }

.btn--line{ color:var(--ink); background:var(--paper-hi); box-shadow:inset 0 0 0 1px rgba(22,32,28,.22); }
.btn--line:hover{ box-shadow:inset 0 0 0 1px rgba(22,32,28,.5); }
.btn--line::before{ background:linear-gradient(104deg, transparent 30%, rgba(224,81,42,.14) 50%, transparent 70%); }

/* ---------------------------------------------------------
   떠 있는 투명 오브제
   --------------------------------------------------------- */
.float{ position:relative; margin:0 0 0 auto; width:min(100%,430px); }
.float__img{ width:100%; filter:drop-shadow(0 34px 40px rgba(48,34,12,.32)); animation:bob 9s ease-in-out infinite; }
@keyframes bob{ 0%,100%{ transform:translateY(0) rotate(0deg);} 50%{ transform:translateY(-14px) rotate(-.8deg);} }
.float__coin{
  position:absolute; right:-2%; top:-2%; width:clamp(70px,9vw,108px);
  filter:drop-shadow(0 14px 20px rgba(48,34,12,.35));
  animation:bob 7s ease-in-out infinite reverse;
}
.float__cap{
  display:flex; align-items:center; justify-content:center; gap:9px; margin-top:6px;
  font-family:var(--f-mono); font-size:11px; letter-spacing:.08em; color:var(--ink-3);
}
.dot{ width:6px; height:6px; border-radius:50%; background:var(--verm); box-shadow:0 0 0 4px rgba(224,81,42,.16); }

.sec__deco{
  position:absolute; right:clamp(16px,4vw,64px); top:clamp(44px,6vw,88px);
  width:min(250px,23vw); z-index:1;
  filter:drop-shadow(0 26px 30px rgba(48,34,12,.24));
  animation:bob 11s ease-in-out infinite;
}

/* ---------------------------------------------------------
   HERO — 카드 없이 종이 위에 바로
   --------------------------------------------------------- */
.hero{
  position:relative; overflow:hidden;
  padding:clamp(22px,3.4vw,34px) 0 0;
  background:
    linear-gradient(180deg, var(--paper-hi) 0%, var(--paper) 62%),
    var(--paper);
}
/* 모눈: 세로 눈금선 */
.hero::before{
  content:""; position:absolute; inset:0; z-index:0; pointer-events:none;
  background-image:repeating-linear-gradient(to right, rgba(22,32,28,.045) 0 1px, transparent 1px 48px);
  mask-image:linear-gradient(180deg, rgba(0,0,0,.9), transparent 78%);
  -webkit-mask-image:linear-gradient(180deg, rgba(0,0,0,.9), transparent 78%);
}
.hero__glow{
  position:absolute; z-index:0; right:2%; top:6%;
  width:min(620px,72vw); aspect-ratio:1;
  background:radial-gradient(circle, rgba(224,81,42,.16), transparent 62%);
  filter:blur(20px); animation:drift 16s ease-in-out infinite alternate;
}
@keyframes drift{ from{ transform:translate3d(0,0,0) scale(1);} to{ transform:translate3d(-34px,30px,0) scale(1.08);} }

.hero__bar{ display:flex; align-items:center; justify-content:space-between; gap:20px; padding-bottom:clamp(26px,4.5vw,52px); }
.brand{ display:inline-flex; align-items:center; gap:12px; text-decoration:none; }
.brand__mark{ display:block; flex:none; }
.brand__type{ display:flex; flex-direction:column; line-height:1.12; font-family:var(--f-disp); font-weight:800; font-size:1.32rem; letter-spacing:.04em; color:var(--ink); }
.brand__type em{ font-family:var(--f-mono); font-style:normal; font-weight:400; font-size:.5em; letter-spacing:.2em; color:var(--brass); margin-top:3px; }
.hero__nav{ display:flex; gap:24px; }
.hero__nav a{ font-size:.88rem; font-weight:500; text-decoration:none; color:var(--ink-2); position:relative; padding-bottom:4px; transition:color .25s; }
.hero__nav a::after{ content:""; position:absolute; left:0; bottom:0; width:0; height:1px; background:var(--verm); transition:width .3s; }
.hero__nav a:hover{ color:var(--ink); }
.hero__nav a:hover::after{ width:100%; }

.hero__grid{ display:grid; grid-template-columns:minmax(0,1.06fr) minmax(0,.94fr); gap:clamp(22px,3vw,50px); align-items:center; padding-bottom:clamp(38px,5vw,66px); }

.live{
  display:inline-flex; align-items:center; gap:9px; margin:0 0 20px;
  padding:6px 15px 6px 12px; border-radius:999px;
  background:var(--paper-hi); box-shadow:inset 0 0 0 1px rgba(224,81,42,.3), 0 6px 16px -10px rgba(190,61,25,.5);
  font-size:.8rem; color:var(--ink-2);
}
.live strong{ font-family:var(--f-mono); font-weight:600; color:var(--verm-deep); }
.live__dot{ width:7px; height:7px; border-radius:50%; background:var(--verm); animation:blink 1.8s ease-in-out infinite; }
@keyframes blink{ 0%,100%{ box-shadow:0 0 0 0 rgba(224,81,42,.5);} 50%{ box-shadow:0 0 0 6px rgba(224,81,42,0);} }

.hero__title{ margin:0 0 20px; font-family:var(--f-disp); font-weight:800; font-size:clamp(2.15rem,5.4vw,3.9rem); line-height:1.2; letter-spacing:-.03em; color:var(--ink); }
.hero__title .line{ display:block; opacity:0; transform:translateY(.42em); animation:rise .95s cubic-bezier(.2,.85,.24,1) forwards; animation-delay:var(--d,0s); }
@keyframes rise{ to{ opacity:1; transform:none; } }

.fx-fill{ font-style:normal; color:var(--verm-deep); }
@supports ((-webkit-background-clip:text) or (background-clip:text)){
  .fx-fill{
    background-image:url("../images/ribbon.jpg");
    background-size:150% auto; background-position:0% 42%;
    -webkit-background-clip:text; background-clip:text;
    color:transparent; -webkit-text-fill-color:transparent;
    animation:fillpan 14s ease-in-out infinite alternate;
  }
}
@keyframes fillpan{ from{ background-position:0% 42%; } to{ background-position:100% 58%; } }

.hero__lead{ margin:0 0 26px; max-width:50ch; font-size:clamp(.95rem,1.5vw,1.03rem); line-height:1.9; color:var(--ink-2); }
.hero__lead strong{ color:var(--ink); font-weight:600; box-shadow:inset 0 -8px 0 rgba(168,134,63,.26); }
.hero__cta{ display:flex; flex-wrap:wrap; gap:12px; margin-bottom:24px; }
.hero__chips{ display:flex; flex-wrap:wrap; gap:8px 20px; margin:0; padding:16px 0 0; list-style:none; border-top:1px solid var(--line); }
.hero__chips li{ display:inline-flex; align-items:center; gap:7px; font-size:.82rem; font-weight:500; color:var(--ink-2); }
.hero__chips i{ color:var(--verm); font-size:.82em; }

.ticker{ overflow:hidden; border-top:1px solid var(--line); border-bottom:1px solid var(--line); background:var(--paper-hi); }
.ticker__track{ display:flex; gap:52px; width:max-content; padding:11px 26px; animation:slide 34s linear infinite; }
.ticker__track span{ display:inline-flex; align-items:center; gap:9px; white-space:nowrap; font-family:var(--f-mono); font-size:11.5px; letter-spacing:.05em; color:var(--ink-3); }
.ticker__track i{ color:var(--brass); }
@keyframes slide{ from{ transform:translateX(0); } to{ transform:translateX(-50%); } }

/* ---------------------------------------------------------
   섹션 바탕 — 종이 톤 미세 교차
   --------------------------------------------------------- */
.sec{ padding:clamp(58px,7.5vw,104px) 0; position:relative; }
.sec--check{ background:var(--paper-2); }
.sec--session{ background:var(--paper); overflow:hidden; }
.sec--voices{ background:var(--paper-2); }
.sec--faq{ background:var(--paper); }

/* ---------------------------------------------------------
   1. 눈금 진단
   --------------------------------------------------------- */
.check{ display:grid; grid-template-columns:minmax(0,.86fr) minmax(0,1.14fr); gap:clamp(26px,3.6vw,56px); align-items:center; }
.check__intro{ position:relative; }
.check__deco{ width:min(220px,58%); margin-top:26px; filter:drop-shadow(0 24px 28px rgba(48,34,12,.26)); animation:bob 10s ease-in-out infinite; }

.quiz{
  background:var(--paper-hi);
  border-radius:14px; padding:clamp(22px,3vw,34px);
  box-shadow:var(--shadow), 0 0 0 1px rgba(22,32,28,.08);
  color:var(--ink);
}
.quiz__bar{ display:flex; gap:6px; margin-bottom:22px; }
.quiz__step{ flex:1; height:3px; border-radius:2px; background:rgba(22,32,28,.12); transition:background .4s; }
.quiz__step.is-on{ background:var(--verm); }

.q{ display:none; }
.q.is-on{ display:block; animation:qin .45s cubic-bezier(.22,.9,.26,1); }
@keyframes qin{ from{ opacity:0; transform:translateY(14px);} to{ opacity:1; transform:none;} }
.q__no{ margin:0 0 8px; font-family:var(--f-mono); font-size:11px; letter-spacing:.14em; color:var(--ink-3); }
.q__no i{ color:var(--verm); }
.q__title{ margin:0 0 18px; font-family:var(--f-disp); font-weight:800; font-size:clamp(1.2rem,2.3vw,1.6rem); letter-spacing:-.02em; color:var(--ink); }

.q__opt{
  display:flex; align-items:center; gap:13px; width:100%; margin-bottom:9px;
  padding:14px 15px; text-align:left; cursor:pointer;
  font-family:var(--f-body); font-size:.93rem; color:var(--ink-2);
  background:var(--paper); border:0; border-radius:9px;
  box-shadow:inset 0 0 0 1px var(--line);
  transition:transform .22s, background .22s, box-shadow .22s, color .22s;
}
.q__opt:hover{ transform:translateX(4px); background:rgba(224,81,42,.06); box-shadow:inset 0 0 0 1px rgba(224,81,42,.5); color:var(--ink); }
.q__key{ flex:none; width:26px; height:26px; display:grid; place-items:center; border-radius:6px; font-family:var(--f-mono); font-size:12px; font-weight:600; color:var(--verm-deep); background:rgba(224,81,42,.1); }
.q__txt{ flex:1; line-height:1.6; }
.q__opt i{ color:var(--ink-3); font-size:.75rem; transition:transform .22s, color .22s; }
.q__opt:hover i{ color:var(--verm); transform:translateX(3px); }

.qres__gauge{ height:12px; margin:4px 0 18px; border-radius:6px; background:rgba(22,32,28,.07); background-image:repeating-linear-gradient(to right, rgba(22,32,28,.13) 0 1px, transparent 1px 18px); overflow:hidden; }
.qres__fill{ display:block; height:100%; width:0; border-radius:6px; background:linear-gradient(90deg,var(--verm-deep),var(--verm-hi)); transition:width 1s cubic-bezier(.22,.9,.26,1); }
.qres__title{ margin:0 0 10px; font-family:var(--f-disp); font-weight:800; font-size:clamp(1.35rem,2.8vw,1.9rem); letter-spacing:-.02em; color:var(--ink); }
.qres__title em{ font-style:normal; color:var(--verm-deep); }
.qres__desc{ margin:0 0 16px; font-size:.94rem; line-height:1.85; color:var(--ink-2); }
.qres__plan{ list-style:none; margin:0 0 20px; padding:0; display:grid; gap:8px; }
.qres__plan li{ display:flex; gap:10px; align-items:flex-start; font-size:.9rem; color:var(--ink-2); }
.qres__plan li::before{ content:""; flex:none; margin-top:9px; width:14px; height:7px; background-image:repeating-linear-gradient(to right,var(--brass) 0 1.5px,transparent 1.5px 5px); }
.qres__cta{ width:100%; }
.qres__again{ display:block; margin:12px auto 0; padding:6px 10px; border:0; background:none; cursor:pointer; font-family:var(--f-mono); font-size:11px; letter-spacing:.08em; color:var(--ink-3); }
.qres__again:hover{ color:var(--verm-deep); }

/* ---------------------------------------------------------
   2. 이번 주 세션 (티켓) + 받는 것
   --------------------------------------------------------- */
.session{
  display:grid; grid-template-columns:270px minmax(0,1fr);
  border-radius:14px; overflow:hidden;
  background:var(--paper-hi);
  box-shadow:0 30px 56px -34px rgba(30,22,10,.42), 0 0 0 1px rgba(22,32,28,.08);
}
.session__stub{ position:relative; padding:clamp(24px,3vw,34px); background:linear-gradient(168deg,#17453B,#0B241F); color:var(--paper); }
.session__stub::after{
  content:""; position:absolute; right:-6px; top:14px; bottom:14px; width:12px;
  background-image:radial-gradient(circle at 50% 50%, var(--paper-hi) 0 4.5px, transparent 5px);
  background-size:12px 20px;
}
.session__dd{
  display:inline-block; margin-bottom:14px; padding:4px 12px; border-radius:5px;
  font-family:var(--f-mono); font-size:11px; font-weight:600; letter-spacing:.12em;
  color:#FFF2EA; background:var(--verm); box-shadow:0 0 16px rgba(224,81,42,.55);
}
.session__date{ margin:0 0 18px; font-family:var(--f-disp); font-size:1.15rem; line-height:1.4; color:rgba(242,237,227,.72); }
.session__date strong{ display:block; font-size:2.4rem; font-weight:800; letter-spacing:-.02em; color:var(--paper-hi); }
.session__meta{ list-style:none; margin:0 0 20px; padding:0; display:grid; gap:8px; }
.session__meta li{ display:flex; align-items:center; gap:9px; font-size:.84rem; color:rgba(242,237,227,.68); }
.session__meta i{ width:15px; color:var(--brass-hi); font-size:.82rem; }
.session__left{ margin:0; font-size:.8rem; color:rgba(242,237,227,.68); }
.session__left strong{ font-family:var(--f-mono); color:var(--verm-hi); }
.session__seatbar{ display:block; height:4px; margin-bottom:8px; border-radius:2px; background:rgba(242,237,227,.18); overflow:hidden; }
.session__seatbar i{ display:block; height:100%; width:70%; background:linear-gradient(90deg,var(--verm-deep),var(--verm-hi)); }

.session__body{ padding:clamp(24px,3vw,36px); color:var(--ink); }
.session__kicker{ margin:0 0 6px; font-family:var(--f-mono); font-size:11px; letter-spacing:.14em; color:var(--ink-3); text-transform:uppercase; }
.session__title{ margin:0 0 22px; font-family:var(--f-disp); font-weight:800; font-size:clamp(1.3rem,2.6vw,1.85rem); letter-spacing:-.02em; color:var(--ink); }

.agenda{ list-style:none; margin:0 0 20px; padding:0; }
.agenda li{ display:flex; gap:16px; padding:13px 0; border-top:1px solid var(--line-2); }
.agenda li:last-child{ border-bottom:1px solid var(--line-2); }
.agenda__t{ flex:none; width:52px; font-family:var(--f-mono); font-size:12px; font-weight:600; color:var(--verm-deep); padding-top:2px; }
.agenda div strong{ display:block; font-size:.95rem; font-weight:600; color:var(--ink); }
.agenda div span{ display:block; font-size:.85rem; line-height:1.7; color:var(--ink-3); }
.session__note{ display:flex; gap:10px; margin:0 0 22px; padding:13px 15px; border-radius:8px; background:rgba(168,134,63,.13); font-size:.86rem; line-height:1.7; color:var(--ink-2); }
.session__note i{ color:var(--brass); padding-top:4px; }

.perks{ display:grid; grid-template-columns:repeat(4,1fr); gap:0; list-style:none; margin:clamp(24px,3vw,38px) 0 0; padding:0; border-top:1px solid var(--line); }
.perks li{ padding:22px 22px 0 0; border-right:1px solid var(--line-2); }
.perks li:last-child{ border-right:0; }
.perks li:not(:first-child){ padding-left:22px; }
.perks i{ display:block; margin-bottom:11px; font-size:1.05rem; color:var(--verm); }
.perks strong{ display:block; font-size:.93rem; font-weight:600; color:var(--ink); }
.perks span{ display:block; font-size:.82rem; color:var(--ink-3); }

/* ---------------------------------------------------------
   3. 멤버 이야기
   --------------------------------------------------------- */
.vhead{ display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between; gap:26px; margin-bottom:clamp(26px,3.6vw,44px); }
.vhead .shead__title{ margin-bottom:0; }
.vnums{ display:flex; gap:clamp(20px,3vw,40px); list-style:none; margin:0; padding:0; }
.vnums li{ display:flex; flex-direction:column; }
.vnum{ font-family:var(--f-mono); font-weight:600; font-size:clamp(1.3rem,2.6vw,1.9rem); line-height:1.1; color:var(--ink); }
.vlab{ margin-top:4px; font-size:.76rem; color:var(--ink-3); }

.thread{ max-width:780px; margin:0 auto; }
.thread__day{ width:fit-content; margin:0 auto 20px; padding:4px 14px; border-radius:999px; font-family:var(--f-mono); font-size:11px; letter-spacing:.08em; color:var(--ink-3); background:rgba(22,32,28,.05); }
.bub{ display:flex; align-items:flex-end; gap:10px; margin-bottom:14px; }
.bub--out{ flex-direction:row-reverse; }
.bub__av{
  flex:none; width:36px; height:36px; border-radius:50%;
  display:grid; place-items:center;
  font-family:var(--f-disp); font-weight:700; font-size:.95rem;
  color:#FBF8F2; background:var(--c,#A8863F);
}
.bub__box{
  max-width:78%; padding:14px 17px; border-radius:16px;
  background:var(--paper-hi); color:var(--ink);
  box-shadow:0 14px 26px -20px rgba(30,22,10,.5), 0 0 0 1px rgba(22,32,28,.06);
}
.bub--in .bub__box{ border-bottom-left-radius:5px; }
.bub--out .bub__box{ border-bottom-right-radius:5px; background:linear-gradient(168deg,#EE5C31,#CE4019); color:#FFF3EC; box-shadow:0 16px 28px -18px rgba(190,61,25,.7); }
.bub__box p{ margin:0; font-size:.92rem; line-height:1.78; }
.bub__t{ display:block; margin-top:8px; font-family:var(--f-mono); font-size:10.5px; letter-spacing:.04em; color:var(--ink-3); }
.bub--out .bub__t{ color:rgba(255,243,236,.75); }
.thread__note{ margin:22px 0 0; text-align:center; font-size:.76rem; color:var(--ink-3); }

/* ---------------------------------------------------------
   4. FAQ
   --------------------------------------------------------- */
.acc{ max-width:820px; }
.acc__item{ border-bottom:1px solid var(--line); }
.acc__item:first-child{ border-top:1px solid var(--line); }
.acc__q{
  display:flex; align-items:center; justify-content:space-between; gap:18px;
  width:100%; padding:19px 2px; border:0; background:none; cursor:pointer; text-align:left;
  font-family:var(--f-body); font-size:clamp(.95rem,1.6vw,1.04rem); font-weight:600;
  color:var(--ink); transition:color .25s;
}
.acc__q:hover{ color:var(--verm-deep); }
.acc__q i{ flex:none; width:26px; height:26px; display:grid; place-items:center; border-radius:6px; font-size:.72rem; color:var(--brass); background:rgba(168,134,63,.14); transition:transform .35s, background .25s, color .25s; }
.acc__item.is-open .acc__q i{ transform:rotate(45deg); color:#FFF2EA; background:var(--verm); }
.acc__a{ max-height:0; overflow:hidden; transition:max-height .45s cubic-bezier(.22,.9,.26,1); }
.acc__item.is-open .acc__a{ max-height:340px; }
.acc__a p{ margin:0; padding:0 2px 22px; font-size:.92rem; line-height:1.92; color:var(--ink-2); max-width:66ch; }
.acc__a a{ color:var(--verm-deep); text-underline-offset:3px; }

/* ---------------------------------------------------------
   5. Final CTA · 신청 방법
   --------------------------------------------------------- */
.final{ position:relative; overflow:hidden; padding:clamp(64px,8.5vw,112px) 0; background:var(--paper-2); text-align:center; }
.final::before{
  content:""; position:absolute; inset:0; z-index:0; pointer-events:none;
  background-image:repeating-linear-gradient(to right, rgba(22,32,28,.045) 0 1px, transparent 1px 48px);
  mask-image:radial-gradient(70% 70% at 50% 50%, rgba(0,0,0,.85), transparent 80%);
  -webkit-mask-image:radial-gradient(70% 70% at 50% 50%, rgba(0,0,0,.85), transparent 80%);
}
.final__glow{
  position:absolute; left:50%; top:52%; transform:translate(-50%,-50%); z-index:0;
  width:min(820px,110vw); aspect-ratio:1;
  background:radial-gradient(circle, rgba(224,81,42,.18), transparent 60%);
  filter:blur(18px); animation:halo 5.5s ease-in-out infinite;
}
.final__inner{ max-width:800px; margin:0 auto; }
.final__title{ margin:10px 0 clamp(30px,4vw,44px); font-family:var(--f-disp); font-weight:800; font-size:clamp(1.7rem,4.2vw,2.9rem); line-height:1.32; letter-spacing:-.025em; color:var(--ink); }

.steps{ list-style:none; margin:0 0 clamp(28px,4vw,42px); padding:0; display:grid; grid-template-columns:repeat(3,1fr); gap:clamp(14px,2vw,24px); text-align:left; }
.steps li{ display:flex; gap:13px; align-items:flex-start; padding:18px 18px 18px 16px; border-radius:11px; background:var(--paper-hi); box-shadow:0 0 0 1px rgba(22,32,28,.07); }
.steps__n{
  flex:none; width:31px; height:31px; display:grid; place-items:center; border-radius:50%;
  font-family:var(--f-mono); font-size:13px; font-weight:600;
  color:#FFF3EC; background:linear-gradient(168deg,#EE5C31,#CE4019);
  box-shadow:0 6px 14px -6px rgba(190,61,25,.85);
}
.steps div strong{ display:block; font-size:.93rem; font-weight:600; color:var(--ink); }
.steps div span{ display:block; font-size:.82rem; line-height:1.65; color:var(--ink-3); }

.final__trust{ display:flex; flex-wrap:wrap; justify-content:center; gap:10px 26px; list-style:none; margin:24px 0 0; padding:0; }
.final__trust li{ display:inline-flex; align-items:center; gap:8px; font-size:.82rem; color:var(--ink-3); }
.final__trust i{ color:var(--brass); }

/* ---------------------------------------------------------
   Footer
   --------------------------------------------------------- */
.foot{ padding:clamp(44px,6vw,68px) 0 40px; background:var(--board-3); color:rgba(242,237,227,.7); }
.foot__top{ display:flex; flex-wrap:wrap; align-items:center; gap:18px 34px; padding-bottom:24px; border-bottom:1px solid rgba(201,164,92,.16); }
.brand--foot .brand__type{ font-size:1.16rem; color:#FBF8F2; }
.brand--foot .brand__type em{ color:rgba(201,164,92,.85); }
.foot__desc{ margin:0; font-size:.88rem; color:rgba(242,237,227,.5); max-width:44ch; }
.foot__disc{ margin:24px 0 20px; font-size:.78rem; line-height:1.9; color:rgba(242,237,227,.38); }
.foot__legal{ display:flex; flex-wrap:wrap; align-items:center; gap:14px; margin-bottom:16px; }
.foot__legal a{ font-size:.84rem; color:rgba(242,237,227,.74); text-decoration:none; border-bottom:1px solid transparent; transition:.25s; }
.foot__legal a:hover{ color:var(--verm-hi); border-bottom-color:var(--verm-hi); }
.foot__legal span{ color:rgba(242,237,227,.25); }
.foot__copy{ margin:0; font-family:var(--f-mono); font-size:11px; letter-spacing:.08em; color:rgba(242,237,227,.32); }

/* ---------------------------------------------------------
   고정 하단 버튼
   --------------------------------------------------------- */
.fixbar{
  position:fixed; left:0; right:0; bottom:0; z-index:60;
  display:flex; justify-content:center;
  padding:14px 18px calc(14px + env(safe-area-inset-bottom));
  background:linear-gradient(180deg, rgba(242,237,227,0), rgba(246,242,234,.9) 40%, rgba(246,242,234,.99));
  backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px);
  border-top:1px solid rgba(22,32,28,.08);
  pointer-events:none;
}
.fixbar__btn{ pointer-events:auto; min-width:min(420px,100%); }

/* ---------------------------------------------------------
   모달
   --------------------------------------------------------- */
.modal{ position:fixed; inset:0; z-index:100; display:flex; align-items:center; justify-content:center; padding:20px; }
.modal[hidden]{ display:none; }
.modal__backdrop{ position:absolute; inset:0; background:rgba(14,32,26,.62); backdrop-filter:blur(4px); animation:fade .3s ease; }
@keyframes fade{ from{opacity:0;} to{opacity:1;} }
.modal__box{
  position:relative; width:min(720px,100%); max-height:82vh; overflow-y:auto;
  padding:clamp(26px,4vw,44px);
  background:var(--paper-hi);
  border-radius:var(--r); color:var(--ink-2);
  box-shadow:0 40px 80px -30px rgba(14,32,26,.5), 0 0 0 1px rgba(22,32,28,.1);
  animation:pop .38s cubic-bezier(.2,.9,.26,1);
}
@keyframes pop{ from{ opacity:0; transform:translateY(22px) scale(.98);} to{opacity:1;transform:none;} }
.modal__close{ position:absolute; right:14px; top:14px; width:38px; height:38px; border:0; cursor:pointer; border-radius:8px; background:rgba(22,32,28,.06); color:var(--ink); font-size:1rem; transition:.25s; }
.modal__close:hover{ background:var(--verm); color:#fff; }
.modal__title{ margin:0 0 20px; font-family:var(--f-disp); font-weight:800; font-size:1.5rem; letter-spacing:-.02em; color:var(--ink); padding-right:44px; }
.modal__title::after{ content:""; display:block; width:52px; height:8px; margin-top:12px; background-image:repeating-linear-gradient(to right,var(--verm) 0 1.5px,transparent 1.5px 6px); }
.modal__body{ font-size:.9rem; line-height:1.92; color:var(--ink-2); }
.modal__body h4{ margin:22px 0 8px; font-family:var(--f-body); font-weight:700; font-size:.95rem; color:var(--ink); }
.modal__body p{ margin:0 0 12px; }
.modal__body ul{ margin:0 0 14px; padding-left:18px; }
.modal__body li{ margin-bottom:6px; }
.modal__body strong{ color:var(--ink); }

/* =========================================================
   반응형
   ========================================================= */
@media (min-width:1180px){
  .rail{ display:block; }
  .wrap{ padding-left:max(44px, 78px); }
  .railtop{ display:none; }
}

@media (max-width:1080px){
  .hero__grid{ grid-template-columns:1fr; gap:26px; }
  .float{ max-width:420px; margin:0 auto; }
  .check{ grid-template-columns:1fr; gap:28px; }
  .check__deco{ display:none; }
  .session{ grid-template-columns:1fr; }
  .session__stub::after{ display:none; }
  .sec__deco{ width:190px; top:32px; opacity:.9; }
}

@media (max-width:900px){
  .sec__deco{ display:none; }
  .perks{ grid-template-columns:repeat(2,1fr); }
  .perks li{ padding:18px 18px 18px 0; border-bottom:1px solid var(--line-2); }
  .perks li:nth-child(2n){ border-right:0; padding-left:18px; }
  .perks li:nth-child(2n+1){ padding-left:0; }
  .perks li:nth-last-child(-n+2){ border-bottom:0; }
  .vhead{ flex-direction:column; align-items:flex-start; gap:18px; }
  .steps{ grid-template-columns:1fr; gap:10px; }
}

@media (max-width:720px){
  body{ font-size:15px; padding-bottom:92px; }
  .hero__nav{ display:none; }
  .hero__bar{ padding-bottom:22px; }
  .hero__grid{ padding-bottom:30px; }

  .live{ font-size:.75rem; padding:5px 13px 5px 10px; margin-bottom:16px; }
  .hero__title{ font-size:clamp(2rem,8.8vw,2.6rem); line-height:1.24; margin-bottom:16px; }
  .hero__lead{ font-size:.9rem; line-height:1.82; margin-bottom:20px; }
  .hero__cta{ gap:9px; margin-bottom:18px; }
  .hero__cta .btn{ width:100%; }
  .hero__chips{ gap:6px 14px; padding-top:14px; }
  .hero__chips li{ font-size:.76rem; }
  .float{ max-width:262px; }
  .float__coin{ width:56px; }
  .float__cap{ font-size:10px; }

  .ticker__track{ gap:34px; padding:9px 16px; }
  .ticker__track span{ font-size:10.5px; }

  .sec{ padding:50px 0; }
  .shead{ margin-bottom:24px; }

  .quiz{ padding:20px 17px 22px; border-radius:12px; }
  .q__title{ font-size:1.14rem; margin-bottom:14px; }
  .q__opt{ padding:13px; font-size:.88rem; gap:11px; }
  .q__opt:hover{ transform:none; }

  .session__stub{ padding:20px; display:grid; grid-template-columns:auto 1fr; gap:6px 20px; align-items:center; }
  .session__dd{ grid-column:1/-1; justify-self:start; margin-bottom:6px; }
  .session__date{ margin:0; font-size:1rem; }
  .session__date strong{ font-size:1.9rem; }
  .session__meta{ margin:0; gap:5px; }
  .session__meta li{ font-size:.78rem; }
  .session__left{ grid-column:1/-1; margin-top:12px; }
  .session__body{ padding:22px 19px 24px; }
  .agenda li{ gap:12px; padding:11px 0; }
  .agenda__t{ width:44px; font-size:11px; }
  .agenda strong{ font-size:.9rem; }
  .agenda span{ font-size:.8rem; }
  .session__note{ font-size:.81rem; padding:11px 13px; }
  .session .btn{ width:100%; }
  .perks{ grid-template-columns:1fr; }
  .perks li{ padding:15px 0; border-right:0; border-bottom:1px solid var(--line-2); }
  .perks li:nth-child(2n){ padding-left:0; }
  .perks li:last-child{ border-bottom:0; }
  .perks i{ margin-bottom:7px; }

  .bub__box{ max-width:84%; padding:12px 15px; }
  .bub__box p{ font-size:.87rem; }
  .bub__av{ width:30px; height:30px; font-size:.85rem; }
  .vnums{ gap:22px; }

  .acc__q{ padding:16px 2px; font-size:.93rem; gap:14px; }
  .acc__a p{ font-size:.86rem; padding-bottom:18px; }

  .final{ padding:56px 0; }
  .final__title{ font-size:clamp(1.5rem,7vw,2rem); }
  .final .btn{ width:100%; }
  .final__trust{ gap:8px 18px; }
  .final__trust li{ font-size:.76rem; }
  .steps li{ padding:15px 15px 15px 14px; }

  .fixbar{ padding:11px 14px calc(11px + env(safe-area-inset-bottom)); }
  .fixbar__btn{ min-width:100%; padding:15px 20px; font-size:.95rem; }

  .modal__box{ padding:24px 20px 28px; max-height:86vh; }
  .modal__title{ font-size:1.24rem; }
  .modal__body{ font-size:.86rem; }
  .foot__disc{ font-size:.74rem; }
}

@media (max-width:380px){
  .hero__title{ font-size:1.82rem; }
  .brand__type{ font-size:1.14rem; }
  .session__date strong{ font-size:1.7rem; }
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{ animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; scroll-behavior:auto !important; }
  .hero__title .line{ opacity:1; transform:none; }
  .reveal{ opacity:1; transform:none; }
}