/* =====================================================================
   GET100 사이트 공통 디자인 (2026-10-11 리브랜딩). 홈(css/home.css)과 같은 앱 우주 디자인.
   원본: _workspace/rebrand-20261011/pages/space.css  ·  빌드: pages/build_pages.py (이 파일을 사이트에서 직접 고치지 말 것)
   1. 구성은 그대로 두고 디자인만 바꾼다.
   2. 여백을 넉넉히. 글꼴은 프리텐다드 하나, 크기와 굵기로만 위계를 만든다.
   3. 바탕은 깊은 보라 우주와 밝은 회백색 두 가지. 밝은 보라는 누르는 것에만, 연두는 한 화면에 한두 곳.
   4. 볼록함은 딱딱한 그림자 대신 떠 있는 깊이(부드러운 그림자, 보라 빛)로 낸다.
   ===================================================================== */
html.sp{--top:#1a0f3d;--bottom:#0b0719;--p:#7b2fff;--p-soft:#a78bfa;--p-deep:#6d28d9;--lav:#c4b5fd;--l:#d4f000;
  --ink:#191f28;--ink-sub:#4e5968;--ink-mut:#8b95a1;--paper:#fafafb;--glass:rgba(255,255,255,.07);--glass-line:rgba(255,255,255,.13);
  --lift-d:inset 0 1px 0 rgba(255,255,255,.08),0 24px 60px rgba(0,0,0,.45),0 0 90px rgba(123,47,255,.20);
  --lift-l:0 1px 2px rgba(25,31,40,.05),0 18px 44px rgba(76,29,149,.12);
  --radius:14px;--sp-r:18px;
  --shadow-b:none;--shadow-w:none;--shadow-y:none;--shadow-p:none;--shadow-sm-b:none;--shadow-sm-w:none;--shadow-sm-y:none;
  --border:1px solid var(--sp-line);--border-w:1px solid var(--sp-line);--border-y:1px solid var(--sp-line);--border-p:1px solid var(--sp-line);
  --font:'Pretendard Variable',Pretendard,-apple-system,BlinkMacSystemFont,'Apple SD Gothic Neo',system-ui,sans-serif;
  --section-py:clamp(96px,11vw,150px)}

/* 밝은 바탕 (기본) */
html.sp body,html.sp [data-sp=paper]{
  --sp-card:#fff;--sp-card-fg:var(--ink);--sp-acc:#f1e9ff;--sp-acc-fg:var(--p-deep);--sp-acc2:var(--p);--sp-soft:#f2f3f6;
  --sp-em:var(--p);--sp-sub:var(--ink-sub);--sp-mut:var(--ink-mut);--sp-line:#e8eaee;--sp-lift:var(--lift-l);--sp-label:var(--p);
  --c-white:#fff;--c-black:var(--ink);--c-gray:#f2f3f6;--c-mid:#f2f3f6;--c-yellow:var(--p);--c-purple:var(--p);--c-muted:var(--ink-sub)}
/* 깊은 보라 우주 */
html.sp [data-sp^=space],html.sp .nav,html.sp .nav__mobile,html.sp .nav__sub,html.sp .footer,html.sp .sticky-cta{
  --sp-card:var(--glass);--sp-card-fg:#fff;--sp-acc:rgba(212,240,0,.14);--sp-acc-fg:var(--l);--sp-acc2:var(--p);--sp-soft:rgba(255,255,255,.05);
  --sp-em:var(--lav);--sp-sub:rgba(255,255,255,.7);--sp-mut:rgba(255,255,255,.48);--sp-line:rgba(255,255,255,.12);--sp-lift:var(--lift-d);--sp-label:var(--l);
  --c-white:#fff;--c-black:#0b0719;--c-gray:var(--glass);--c-mid:var(--glass);--c-yellow:var(--lav);--c-purple:var(--lav);--c-muted:rgba(255,255,255,.7)}

html.sp body{background:var(--paper);color:var(--ink);font-family:var(--font);word-break:keep-all;-webkit-font-smoothing:antialiased;letter-spacing:-0.01em}
html.sp [data-sp]{position:relative;isolation:isolate}
html.sp [data-sp^=space]{color:#fff;
  background:radial-gradient(60% 50% at 78% 18%,rgba(123,47,255,.30),rgba(123,47,255,.07) 55%,transparent 78%),linear-gradient(var(--top),var(--bottom))}
html.sp [data-sp=space-q]{background:radial-gradient(50% 40% at 18% 16%,rgba(123,47,255,.18),transparent 70%),linear-gradient(var(--bottom),#120a2c)}
html.sp [data-sp=paper]{background:var(--paper);color:var(--ink)}
html.sp .sp-stars{position:absolute!important;inset:0;pointer-events:none;z-index:-1!important;overflow:hidden}
html.sp .section{padding-block:var(--section-py)}

/* ---------- 글 ---------- */
html.sp h1,html.sp .h1{font-size:clamp(2.2rem,4vw,3.4rem);font-weight:700;letter-spacing:-0.04em;line-height:1.24}
html.sp h2,html.sp .h2{font-size:clamp(1.8rem,3vw,2.65rem);font-weight:700;letter-spacing:-0.035em;line-height:1.32}
html.sp h3,html.sp .h3{font-weight:700;letter-spacing:-0.02em;line-height:1.45}
html.sp .display{font-weight:700;letter-spacing:-0.04em}
html.sp .body-lg{color:var(--sp-sub);line-height:1.8}
html.sp .label{letter-spacing:0;text-transform:none;font-size:.9375rem;font-weight:600}
html.sp strong,html.sp b{font-weight:700}
html.sp ::selection{background:rgba(123,47,255,.28)}

/* 구간 이름표: 홈과 같은 크기(밤밤 "섹션 제목 폰트가 너무 작다") */
html.sp .badge{display:inline-block;background:none!important;border:0!important;box-shadow:none!important;padding:0!important;border-radius:0!important;
  font-size:clamp(1.125rem,1.6vw,1.5rem)!important;font-weight:700!important;letter-spacing:-0.02em!important;line-height:1.3;color:var(--sp-label)!important;text-transform:none!important}
/* 카드 안 작은 이름표 */
html.sp :is([class*=card],[class*=item],[class*=step],li,td,.sp-card) .badge{font-size:.9375rem!important;font-weight:600!important}

/* 작은 이름표(.label)도 구간 맨 위에서는 구간 이름표 크기로 */
html.sp .label{display:inline-block;font-size:clamp(1.125rem,1.6vw,1.5rem);font-weight:700;letter-spacing:-0.02em;line-height:1.3;color:var(--sp-label);text-transform:none}
html.sp :is([class*=card],[class*=item],[class*=step],li,td,.sp-card) .label{font-size:.9375rem;font-weight:600}

/* 제목 속 키워드: 상자·그림자 대신 글자색 (홈과 같음) */
html.sp :is(.hero-h1__keyword--block,.hx-kw-block,[class*="kw-block"],[class*="keyword--block"]){background:none!important;color:var(--sp-em)!important;padding:0!important;box-shadow:none!important;border:0!important}
html.sp .hero-h1__keyword--shadow{text-shadow:none!important;color:inherit!important}
html.sp .hero-h1__brand{color:var(--l)!important;text-shadow:none!important}
html.sp [data-sp=paper] .hero-h1__brand{color:var(--p)!important}

/* 형광펜 강조 → 글자색 강조 */
html.sp :is(.hl,.hl-cy,.hl-yl,.story-hl,mark){background:none!important;color:var(--sp-em)!important;padding:0!important;box-shadow:none!important;font-weight:700}

/* ---------- 버튼 ---------- */
html.sp .btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:54px;padding:0 24px;border-radius:14px;border:1px solid transparent;
  font-family:inherit;font-weight:600;font-size:1rem;letter-spacing:-0.01em;line-height:1.3;box-shadow:none;text-decoration:none;
  transition:transform .3s cubic-bezier(.2,.9,.25,1.2),box-shadow .3s ease,background-color .2s ease,border-color .2s ease,color .2s ease}
html.sp .btn:active{transform:translateY(0) scale(.98)}
/* 가장 중요한 버튼: 우주 바탕은 연두, 밝은 바탕은 보라 */
html.sp :is(.btn--yellow,.btn--y,.btn--black,.btn--purple){background:var(--p);color:#fff;border-color:transparent;box-shadow:0 12px 30px rgba(123,47,255,.30)}
html.sp [data-sp^=space] :is(.btn--yellow,.btn--y){background:var(--l);color:#140c30;box-shadow:0 10px 30px rgba(212,240,0,.18)}
html.sp [data-sp^=space] .btn--black{background:var(--glass);color:#fff;border-color:var(--glass-line);box-shadow:none}
/* 두 번째 버튼 */
html.sp :is(.btn--white,.btn--outline-white,.btn--outline-black,.btn--ghost,.btn--shadow-lime){background:#fff;color:var(--ink)!important;border-color:#e5e8eb;box-shadow:none}
html.sp [data-sp^=space] :is(.btn--white,.btn--outline-white,.btn--outline-black,.btn--ghost){background:var(--glass);color:#fff!important;border-color:var(--glass-line);backdrop-filter:blur(8px)}
html.sp .btn--sm{min-height:42px;padding:0 16px;font-size:.9375rem;border-radius:12px}
@media (hover:hover) and (pointer:fine){
  html.sp .btn:hover{transform:translateY(-4px)}
  html.sp :is(.btn--yellow,.btn--y,.btn--black,.btn--purple):hover{background:#8a45ff;box-shadow:0 20px 46px rgba(123,47,255,.5)}
  html.sp [data-sp^=space] :is(.btn--yellow,.btn--y):hover{background:var(--l);box-shadow:0 20px 46px rgba(212,240,0,.36)}
  html.sp [data-sp^=space] .btn--black:hover,html.sp [data-sp^=space] :is(.btn--white,.btn--outline-white,.btn--outline-black,.btn--ghost):hover{background:rgba(255,255,255,.16);border-color:rgba(255,255,255,.4);box-shadow:0 16px 40px rgba(0,0,0,.4)}
  html.sp [data-sp=paper] :is(.btn--white,.btn--outline-white,.btn--outline-black,.btn--ghost):hover,html.sp body>:not([data-sp]) :is(.btn--white,.btn--outline-white,.btn--outline-black,.btn--ghost):hover{border-color:var(--p);color:var(--p)!important;box-shadow:0 16px 38px rgba(76,29,149,.18)}
}

/* ---------- 카드·태그·표 ---------- */
html.sp .card{border-radius:var(--sp-r);background:var(--sp-card);box-shadow:var(--sp-lift);border:1px solid var(--sp-line)}
html.sp .member-tag{border-radius:999px;padding:9px 16px;font-weight:500;background:var(--sp-card);color:var(--sp-card-fg);border:1px solid var(--sp-line);box-shadow:none}
html.sp .member-tag:hover{background:var(--sp-card);transform:translateY(-2px)}
html.sp hr{border:0;border-top:1px solid var(--sp-line)}
html.sp img{border-radius:inherit}

/* ---------- 질문 목록 ---------- */
html.sp .faq-item{border-color:var(--sp-line)!important}
html.sp .faq-q{color:inherit;font-weight:600}
html.sp .faq-a{color:var(--sp-sub)}

/* ---------- 입력칸: 예전 이름(--dark/--white)이 아니라 지금 구간 바탕을 따른다 ---------- */
html.sp .input,html.sp .input--dark,html.sp .input--white{border-radius:12px;border:1px solid #e2e5ea;background:#f6f7f9;color:var(--ink);box-shadow:none;min-height:54px}
html.sp :is(.input,.input--dark,.input--white)::placeholder{color:var(--ink-mut)}
html.sp :is(.input,.input--dark,.input--white):focus{outline:none;border-color:var(--p);background:#fff;box-shadow:0 0 0 4px rgba(123,47,255,.14)}
html.sp [data-sp^=space] :is(.input,.input--dark,.input--white){background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.18);color:#fff}
html.sp [data-sp^=space] :is(.input,.input--dark,.input--white)::placeholder{color:rgba(255,255,255,.45)}
html.sp [data-sp^=space] :is(.input,.input--dark,.input--white):focus{background:rgba(255,255,255,.09);border-color:var(--p-soft)}
html.sp textarea.input{min-height:120px}
html.sp .form__label{color:inherit;font-weight:600;letter-spacing:0;text-transform:none}
html.sp input[type=checkbox],html.sp input[type=radio]{accent-color:var(--p)}

/* ---------- 메뉴·푸터 (홈과 같음) ---------- */
html.sp .nav{background:rgba(11,7,25,.94);-webkit-backdrop-filter:saturate(140%) blur(14px);backdrop-filter:saturate(140%) blur(14px);border-bottom:1px solid rgba(255,255,255,.08);box-shadow:none;color:#fff}
html.sp .nav__sub,html.sp .nav__mobile{background:#0b0719}
html.sp .nav .btn--yellow{background:#7b2fff;color:#fff;border:0;border-radius:12px;box-shadow:none;padding:10px 18px;font-weight:600;min-height:0}
html.sp .nav .btn--yellow:hover{background:#6a23e6;color:#fff;transform:none;box-shadow:none}
@media (max-width:768px){html.sp .nav__cta.desktop{display:none}}
html.sp :is(.nav__logo,.footer__logo) span{color:var(--l)!important}
html.sp .nav__mobile,html.sp .nav__mobile a{color:#fff}
html.sp .nav__mobile a{border-color:rgba(255,255,255,.1)!important}
html.sp .nav__mobile-sub,html.sp .nav__mobile-sub a{color:rgba(255,255,255,.75)}
html.sp .nav__toggle span{background:#fff}
html.sp .nav__mobile a:hover{color:var(--l)}
html.sp .nav__links a:hover{color:var(--l)}
html.sp .footer{background:#0b0719;color:rgba(255,255,255,.7);border-top:1px solid rgba(255,255,255,.06)}
@media (hover:hover){html.sp .footer a{transition:color .2s}html.sp .footer a:hover{color:var(--l)}}

/* 하단 고정 버튼: 꽉 찬 띠 대신 떠 있는 둥근 버튼 (홈과 같음) */
html.sp .sticky-cta{left:50%!important;right:auto!important;bottom:18px!important;width:auto!important;max-width:calc(100vw - 32px);transform:translateX(-50%);
  display:inline-flex;align-items:center;justify-content:center;background:var(--p)!important;color:#fff!important;border:0!important;border-radius:999px!important;
  font-weight:600;font-size:.9375rem;letter-spacing:-0.01em;padding:14px 22px!important;white-space:nowrap;text-decoration:none;
  box-shadow:0 14px 40px rgba(0,0,0,.35),0 0 0 1px rgba(255,255,255,.12) inset!important;transition:opacity .35s ease,transform .35s ease,background-color .2s}
html.sp .sticky-cta.is-hidden{transform:translate(-50%,140%)!important;opacity:0}
html.sp .sticky-cta:hover{background:#6a23e6!important}

/* ---------- PC 별 커서 (홈과 같음). 터치 기기·움직임 줄이기는 기본 커서 ---------- */
.g7-cur,.g7-cur-glow{position:fixed;left:0;top:0;z-index:10000;pointer-events:none;opacity:0;transition:opacity .2s ease;width:0;height:0}
.g7-cur.is-on,.g7-cur-glow.is-on{opacity:1}
.g7-cur svg{position:absolute;left:-16px;top:-16px;width:32px!important;height:32px!important;max-width:none!important;max-height:none!important;overflow:visible;
  filter:drop-shadow(0 0 1.2px rgba(255,255,255,.95)) drop-shadow(0 3px 6px rgba(0,0,0,.45));transition:transform .28s cubic-bezier(.2,.9,.25,1.25)}
.g7-cur__spin{transform-origin:60px 60px;transition:transform .45s cubic-bezier(.2,.8,.2,1)}
.g7-cur__dot{transform-box:fill-box;transform-origin:center}
.g7-cur.is-hover svg{transform:scale(1.65) rotate(-10deg)}
.g7-cur.is-hover .g7-cur__spin{transform:rotate(-18deg)}
.g7-cur.is-hover .g7-cur__dot{animation:g7dot .9s ease-in-out infinite alternate}
.g7-cur.is-down svg{transform:scale(.82)}
.g7-cur.is-hover.is-down svg{transform:scale(1.35) rotate(-10deg)}
.g7-cur.is-text,.g7-cur-glow.is-text{opacity:0}
@keyframes g7dot{from{transform:scale(1)}to{transform:scale(1.6)}}
.g7-cur-glow::before{content:"";position:absolute;left:-26px;top:-26px;width:52px;height:52px;border-radius:50%;
  background:radial-gradient(circle,rgba(167,139,250,.42),rgba(123,47,255,.12) 50%,transparent 72%);transition:transform .35s cubic-bezier(.2,.8,.2,1),background .35s}
.g7-cur-glow.is-hover::before{transform:scale(2);background:radial-gradient(circle,rgba(212,240,0,.30),rgba(123,47,255,.18) 48%,transparent 72%)}
@media (hover:hover) and (pointer:fine){
  html.g7-has-cursor,html.g7-has-cursor body,html.g7-has-cursor a,html.g7-has-cursor button,html.g7-has-cursor label,html.g7-has-cursor select,
  html.g7-has-cursor [role="button"],html.g7-has-cursor summary,html.g7-has-cursor input[type="checkbox"],html.g7-has-cursor input[type="radio"],html.g7-has-cursor input[type="submit"]{cursor:none}
  html.g7-has-cursor :is(input[type="email"],input[type="text"],input[type="tel"],input[type="url"],input[type="number"],input[type="search"],textarea){cursor:text}
}
@media (prefers-reduced-motion:reduce){html.sp *{transition:none!important;animation-duration:.01ms!important}}