/* GET100 공통 기본 스타일(리브랜딩판). css/style.css를 build_pages.py가 옮긴 것. 직접 고치지 말 것.
   예전 페이지는 style.css를 그대로 쓰고, 바뀐 페이지만 이 파일을 쓴다. */
/* ====================================================================
   GET100 — Design System CSS
   Neo-brutalism, 단정 버전
   컬러: Black #0d0d0d / White #f5f5f0 / Yellow #d4f000 / Purple #7b2fff
   폰트: Pretendard
   ==================================================================== */

/* === PRETENDARD FONT === */
@import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/variable/pretendardvariable.min.css');

/* === RESET === */
*, *::before, *::after {box-sizing:border-box;margin:0;padding:0}

html {scroll-behavior:smooth;-webkit-text-size-adjust:100%}

img, picture, video, canvas, svg {display:block;max-width:100%}
input, button, textarea, select {font:inherit}
p, h1, h2, h3, h4 {overflow-wrap:break-word;word-break:keep-all}

/* === DESIGN TOKENS === */
:root {/* colors */
  --c-black:#0d0d0d;--c-white:#f5f5f0;--c-yellow:#d4f000;--c-purple:#7b2fff;--c-gray:#1a1a1a;--c-mid:#111111;--c-muted:#555555;/* typography */
  --font:'Pretendard Variable', 'Pretendard', -apple-system, BlinkMacSystemFont, system-ui, sans-serif;/* layout */
  --max-w:1140px;--pad-x:clamp(20px, 5vw, 48px);--section-py:clamp(72px, 10vw, 120px);/* brutalist tokens */
  --border:2px solid var(--c-black);--border-w:2px solid var(--c-white);--border-y:2px solid var(--c-yellow);--border-p:2px solid var(--c-purple);--shadow-b:5px 5px 0 0 var(--c-black);--shadow-w:5px 5px 0 0 var(--c-white);--shadow-y:5px 5px 0 0 var(--c-yellow);--shadow-p:5px 5px 0 0 var(--c-purple);--shadow-sm-b:3px 3px 0 0 var(--c-black);--shadow-sm-w:3px 3px 0 0 var(--c-white);--shadow-sm-y:3px 3px 0 0 var(--c-yellow);/* radius:ZERO — neo-brutalism */
  --radius: 0;/* transitions */
  --t-fast:80ms ease-out;--t-mid:140ms ease-out}

/* === BASE === */
body {font-family:var(--font);font-size:1rem;line-height:1.8;color:var(--sp-card-fg);background:var(--sp-card);-webkit-font-smoothing:antialiased;overflow-x:clip}

/* === TYPOGRAPHY SCALE === */
.display {font-size:clamp(2.75rem, 6vw, 4.5rem);font-weight:800;line-height:1.2;word-break:keep-all}

h1, .h1 {font-size:clamp(2rem, 4.5vw, 3.25rem);font-weight:800;line-height:1.2;word-break:keep-all}

h2, .h2 {font-size:clamp(1.5rem, 3vw, 2.25rem);font-weight:700;line-height:1.2;word-break:keep-all}

h3, .h3 {font-size:clamp(1.125rem, 2vw, 1.375rem);font-weight:700;line-height:1.3;word-break:keep-all}

.body-lg {font-size:clamp(1rem, 1.5vw, 1.125rem);line-height:1.85;word-break:keep-all}

.body-sm {font-size:0.875rem;line-height:1.7}

.label {font-size:0.6875rem;font-weight:700;letter-spacing:0.14em;text-transform:uppercase}

.num-display {font-size:clamp(2.5rem, 6vw, 4rem);font-weight:800;line-height:1.2}

/* === LAYOUT UTILS === */
.container {max-width:var(--max-w);margin-inline:auto;padding-inline:var(--pad-x)}

.section {padding-block:var(--section-py)}

/* === BACKGROUND-AWARE BUTTON SHADOWS === */

/* 검정·회색 배경: 노란 버튼 그림자를 흰색으로 */
.section--dark .btn--yellow,
.section--gray .btn--yellow {box-shadow:var(--sp-lift);border-radius:var(--sp-r)}
.section--dark .btn--yellow:hover,
.section--gray .btn--yellow:hover  {box-shadow:var(--sp-lift);border-radius:var(--sp-r)}
.section--dark .btn--yellow:active,
.section--gray .btn--yellow:active {box-shadow:none}

/* 보라 배경: 검정 버튼 그림자를 라임으로 */
.section--purple .btn--black {box-shadow:var(--sp-lift);border-radius:var(--sp-r)}
.section--purple .btn--black:hover  {box-shadow:var(--sp-lift);border-radius:var(--sp-r)}
.section--purple .btn--black:active {box-shadow:none}

/* 네비(검정 배경): 노란 버튼 그림자를 흰색으로 */
.nav .btn--yellow {box-shadow:none}
.nav .btn--yellow:hover  {box-shadow:var(--sp-lift);border-radius:var(--sp-r)}
.nav .btn--yellow:active {box-shadow:none}

/* Section color themes */
.section--dark {background:var(--sp-card);color:var(--sp-card-fg)}

.section--white {background:var(--sp-card);color:var(--sp-card-fg)}

.section--yellow {background:var(--sp-acc);color:var(--sp-acc-fg)}

.section--purple {background:var(--sp-acc2);color:var(--c-white)}

.section--gray {background:var(--sp-card);color:var(--sp-card-fg)}

/* Grids */
.grid-2 {display:grid;grid-template-columns:repeat(2, 1fr);gap:24px}
.grid-3 {display:grid;grid-template-columns:repeat(3, 1fr);gap:24px}
.grid-4 {display:grid;grid-template-columns:repeat(4, 1fr);gap:20px}

@media (max-width: 900px) {
  .grid-4 {grid-template-columns:repeat(2, 1fr)}
  .grid-3 {grid-template-columns:repeat(2, 1fr)}
}
@media (max-width: 600px) {
  .grid-4, .grid-3, .grid-2 {grid-template-columns:1fr}
}

/* Stack / Cluster */
.stack {display:flex;flex-direction:column}
.cluster {display:flex;flex-wrap:wrap;align-items:center}

/* === BRUTALIST COMPONENTS === */

/* Badge / Tag */
.badge {display:inline-block;padding:4px 10px;font-size:0.6875rem;font-weight:700;letter-spacing:0.12em;text-transform:uppercase;border:none;line-height:1.4}

.badge--yellow {background:var(--sp-acc);color:var(--sp-acc-fg);border-color:var(--sp-line)}

.badge--black {background:var(--sp-card);color:var(--sp-card-fg);border-color:var(--sp-line)}

.badge--white {background:var(--sp-card);color:var(--sp-card-fg);border-color:var(--sp-line)}

.badge--purple {background:var(--sp-acc2);color:var(--c-white);border-color:var(--sp-line)}

/* Buttons */
.btn {display:inline-flex;align-items:center;gap:8px;padding:14px 28px;font-family:var(--font);font-size:0.9375rem;font-weight:700;letter-spacing:0.02em;text-decoration:none;border:1px solid var(--sp-line);cursor:pointer;transition:transform var(--t-fast), box-shadow var(--t-fast);white-space:nowrap;border-radius:var(--sp-r)}

.btn:hover  {transform:translateY(-3px)}
.btn:active {transform:translateY(1px)}

.btn--black {background:var(--sp-card);color:var(--sp-card-fg);border-color:var(--sp-line);box-shadow:var(--shadow-b)}
.btn--black:hover  {box-shadow:var(--sp-lift);border-radius:var(--sp-r)}
.btn--black:active {box-shadow:none}
.btn--shadow-lime {box-shadow:var(--sp-lift);border-radius:var(--sp-r)}
.btn--shadow-lime:hover  {box-shadow:var(--sp-lift);border-radius:var(--sp-r)}
.btn--shadow-lime:active {box-shadow:none}


.btn--white {background:var(--sp-card);color:var(--sp-card-fg);border-color:var(--sp-line);box-shadow:var(--shadow-w)}
.btn--white:hover  {box-shadow:var(--sp-lift);border-radius:var(--sp-r)}
.btn--white:active {box-shadow:none}

.btn--yellow {background:var(--sp-acc);color:var(--sp-acc-fg);border-color:var(--sp-line);box-shadow:var(--shadow-b)}
.btn--yellow:hover  {box-shadow:var(--sp-lift);border-radius:var(--sp-r)}
.btn--yellow:active {box-shadow:none}

.btn--outline-white {background:var(--sp-card);color:var(--sp-card-fg) !important;border-color:var(--sp-line);box-shadow:var(--sp-lift);border-radius:var(--sp-r)}
.btn--outline-white:hover  {box-shadow:var(--sp-lift);border-radius:var(--sp-r)}
.btn--outline-white:active {box-shadow:var(--sp-lift);border-radius:var(--sp-r)}

.btn--outline-black {background:transparent;color:inherit;border-color:var(--sp-line);box-shadow:var(--shadow-b)}
.btn--outline-black:hover  {box-shadow:var(--sp-lift);border-radius:var(--sp-r)}
.btn--outline-black:active {box-shadow:none}

/* Cards */
.card {padding:28px;border:1px solid var(--sp-line);position:relative;border-radius:var(--sp-r)}

.card--dark {background:var(--sp-card);color:var(--sp-card-fg);border-color:var(--sp-line);box-shadow:var(--shadow-w)}

.card--white {background:var(--sp-card);color:var(--sp-card-fg);border-color:var(--sp-line);box-shadow:var(--shadow-b)}

.card--outline {background:transparent;color:inherit;border-color:var(--sp-line)}

.card--outline-w {background:transparent;color:inherit;border-color:var(--sp-line)}

/* Inputs */
.input {display:block;width:100%;padding:14px 16px;font-family:var(--font);font-size:1rem;background:transparent;border:1px solid var(--sp-line);outline:none;transition:border-color var(--t-fast), box-shadow var(--t-fast);border-radius:var(--sp-r)}
.input:focus {border-color:var(--sp-line);box-shadow:none}

.input--white {background:var(--sp-card);border-color:var(--sp-line);color:var(--sp-card-fg)}
.input--white::placeholder {color:var(--sp-sub)}
.input--white:focus {border-color:var(--sp-line);box-shadow:none}

.input--dark {background:transparent;border-color:var(--sp-line);color:inherit}
.input--dark::placeholder {color:var(--sp-sub)}

.image-brief-slot {border:1px dashed var(--sp-line);background:rgba(13,13,13,0.04);padding:40px 24px;text-align:center;border-radius:var(--sp-r)}

.image-brief-slot--dark {border-color:var(--sp-line);background:var(--sp-soft)}

.image-brief-slot__tag {display:inline-block;font-size:0.6875rem;font-weight:800;letter-spacing:0.1em;color:var(--sp-em);margin-bottom:10px}

.image-brief-slot--dark .image-brief-slot__tag {color:var(--sp-em)}

.image-brief-slot__guide {font-size:0.9375rem;line-height:1.65;color:var(--sp-sub);word-break:keep-all;max-width:620px;margin:0 auto}

.image-brief-slot--dark .image-brief-slot__guide {color:var(--sp-sub)}

/* Horizontal rule */
.rule {border:none;border-top:1px solid var(--sp-line);opacity:0.15;margin-block:0}
.rule--solid {opacity:1}

/* Accent text */
.accent-yellow {color:var(--sp-em)}
.accent-purple {color:var(--sp-em)}

/* Strikethrough for price ladder */
.price-old {text-decoration:line-through;opacity:0.45}

/* Blockquote / Quote */
.quote {padding:24px 28px;border-left:1px solid var(--sp-line);font-size:0.9375rem;line-height:1.85;word-break:keep-all}

.quote--yellow {border-left-color:var(--c-yellow)}

/* === NAVIGATION === */
.nav {position:sticky;top:0;z-index:100;background:var(--sp-card);color:var(--sp-card-fg);border-bottom:1px solid var(--sp-line);overflow:visible}

.nav__inner {max-width:var(--max-w);margin-inline:auto;padding-inline:var(--pad-x);height:64px;display:flex;align-items:center;justify-content:space-between;gap:24px;overflow:visible}

.nav__logo {font-size:1.125rem;font-weight:800;color:inherit;text-decoration:none;flex-shrink:0;transition:transform var(--t-fast), opacity var(--t-fast)}

.nav__logo span {color:var(--sp-em)}

.nav__logo:hover {transform:translateY(-1px);opacity:0.9}
.nav__logo:active {transform:translateY(0)}

.nav__links {display:flex;align-items:center;gap:4px;list-style:none;flex:1;justify-content:center}

.nav__links a {position:relative;padding:8px 14px;font-size:0.875rem;font-weight:500;color:var(--sp-sub);text-decoration:none;transition:color var(--t-fast)}
.nav__links a::after {content:"";position:absolute;left:14px;right:14px;bottom:2px;height:2px;background:var(--sp-acc);transform:scaleX(0);transform-origin:left center;transition:transform 220ms cubic-bezier(0.22, 1, 0.36, 1)}
.nav__links a:hover {color:var(--sp-em)}
.nav__links a:hover::after {transform:scaleX(1)}

.nav__cta {flex-shrink:0;font-size:0.8125rem;padding:6px 14px}

/* Hamburger */
.nav__toggle {display:none;flex-direction:column;gap:5px;cursor:pointer;padding:8px;background:none;border:none}
.nav__toggle span {display:block;width:24px;height:2px;background:var(--sp-card);transition:var(--t-mid)}

/* Mobile nav */
.nav__mobile {display:none;position:fixed;inset:64px 0 0;background:var(--sp-card);z-index:99;padding:32px var(--pad-x);flex-direction:column;gap:8px}

.nav__mobile a {display:block;padding:14px 0;font-size:1.125rem;font-weight:600;color:inherit;text-decoration:none;border-bottom:1px solid var(--sp-line)}

.nav__mobile.open {display:flex}

@media (max-width: 768px) {
  .nav__links {display:none}
  .nav__cta.desktop {display:none}
  .nav__toggle {display:flex}
}

/* === FOOTER === */
.footer {background:var(--sp-card);color:var(--sp-card-fg);padding-block:30px}

.footer__inner {max-width:var(--max-w);margin-inline:auto;padding-inline:var(--pad-x)}

.footer__top {display:grid;grid-template-columns:2fr 1fr 1fr;gap:48px;padding-bottom:48px;border-bottom:1px solid var(--sp-line)}

.footer__brand-name {font-size:1.5rem;font-weight:800;margin-bottom:8px;color:inherit}

.footer__brand-name span {color:var(--sp-em)}

.footer__tagline {font-size:0.875rem;color:var(--sp-mut);margin-bottom:24px}

.footer__social {display:flex;flex-wrap:wrap;gap:14px}

.footer__social a {display:inline-flex;align-items:center;justify-content:center;color:inherit;transition:color var(--t-fast)}
.footer__social a svg {width:22px;height:22px}
.footer__social a:hover {color:var(--sp-em)}

.footer__nav-title {font-size:0.6875rem;font-weight:700;letter-spacing:0.12em;text-transform:uppercase;color:var(--sp-mut);margin-bottom:20px}

.footer__nav-links {list-style:none;display:flex;flex-direction:column;gap:0}

.footer__nav-links a {font-size:0.875rem;color:var(--sp-sub);text-decoration:none;transition:color var(--t-fast)}
.footer__nav-links a:hover {color:var(--sp-em)}

.footer__bottom {display:flex;justify-content:space-between;align-items:flex-start;gap:24px;padding-top:32px}

.footer__biz {font-size:0.75rem;color:var(--sp-mut);line-height:1.8}

.footer__policy {display:flex;gap:16px;flex-wrap:wrap}

.footer__policy a {font-size:0.75rem;color:var(--sp-mut);text-decoration:none;transition:color var(--t-fast)}
.footer__policy a:hover {color:var(--sp-em)}

.footer__copy {font-size:0.75rem;color:var(--sp-mut);margin-top:8px}

@media (max-width: 768px) {
  .footer__top {grid-template-columns:1fr;gap:32px}
  .footer__bottom {flex-direction:column}
}

/* Scroll reveal */
.reveal {opacity:0;transform:translateY(36px);transition:opacity 0.7s cubic-bezier(0.22,1,0.36,1), transform 0.7s cubic-bezier(0.22,1,0.36,1)}
.reveal.is-visible {opacity:1;transform:translateY(0)}

/* === SECTION-SPECIFIC OVERRIDES === */

/* ──────────────────────────────────────────
   Hero — 배경 클래스만 바꾸면 요소 색 자동 적응
   어두운 배경 (dark / purple / gray): 라임 뱃지, 흰 텍스트, 흰 아웃라인
   밝은 배경  (white / yellow):        검정 뱃지, 검정 텍스트, 검정 아웃라인
   ────────────────────────────────────────── */
#hero.section--dark,
#hero.section--purple,
#hero.section--gray {--h-badge-bg:var(--c-yellow);--h-badge-color:var(--c-black);--h-subtitle:rgba(245,245,240,0.72);--h-outline-border:rgba(245,245,240,0.55);--h-outline-text:var(--c-white);--h-outline-shadow:var(--c-white)}

#hero.section--white,
#hero.section--yellow {--h-badge-bg:var(--c-black);--h-badge-color:var(--c-white);--h-subtitle:rgba(13,13,13,0.65);--h-outline-border:rgba(13,13,13,0.55);--h-outline-text:var(--c-black);--h-outline-shadow:var(--c-black)}

/* 토큰 적용 */
#hero .badge {background:var(--h-badge-bg,    var(--c-yellow)) !important;color:var(--h-badge-color, var(--c-black))  !important;border-color:var(--h-badge-bg,    var(--c-yellow)) !important}

#hero .body-lg {color:var(--h-subtitle, rgba(245,245,240,0.72)) !important}

#hero .btn--outline-black {border-color:var(--h-outline-border, rgba(245,245,240,0.55)) !important;color:var(--h-outline-text,   var(--c-white))          !important}
#hero .btn--outline-black:hover {box-shadow:8px 8px 0 0 var(--h-outline-shadow, var(--c-white)) !important}

/* Hero divider line */
.hero__divider {width:40px;height:3px;background:var(--sp-acc);margin-block:28px}

/* Timeline steps (legacy) */
.timeline {display:flex;flex-direction:column;gap:0}
.timeline__step {display:grid;grid-template-columns:56px 1fr;gap:0;border-top:1px solid var(--sp-line);padding-block:28px;align-items:start}
.timeline__step:last-child {border-bottom:1px solid var(--sp-line)}
.timeline__num {font-size:0.6875rem;font-weight:700;letter-spacing:0.1em;color:var(--sp-em);padding-top:3px}
.timeline__content h3 {margin-bottom:6px}
.timeline__content p {font-size:0.9375rem;opacity:0.75}

/* About section 2 — manifesto + image strip */
.about2 {padding-bottom:0;overflow-x:hidden}

.about2__top {display:grid;grid-template-columns:1.15fr 0.85fr;gap:clamp(40px, 5vw, 80px);align-items:start;margin-bottom:100px}

.about2__label {font-family:var(--font-mono);font-size:0.75rem;letter-spacing:0.12em;color:var(--sp-sub);margin-bottom:28px}

.about2__lead-line {font-size:1.0625rem;line-height:1.7;color:var(--sp-sub);word-break:keep-all;margin-bottom:32px}

.about2__close-line {margin-top:32px;font-size:1.0625rem;line-height:1.7;color:inherit;font-weight:600;word-break:keep-all}

.about2__pillars {list-style:none;display:flex;flex-direction:column;gap:22px}

.about2__pillars li {display:grid;grid-template-columns:104px 1fr;gap:20px;align-items:baseline}

.about2__pillar-name {font-size:1.0625rem;font-weight:800;color:var(--sp-em);white-space:nowrap}

.about2__pillar-desc {font-size:0.9375rem;line-height:1.65;color:var(--sp-sub);word-break:keep-all}

@media (max-width: 480px) {
  .about2__pillars li {grid-template-columns:1fr;gap:4px}
}

.about2__portrait {border:1px solid var(--sp-line);box-shadow:var(--sp-lift);overflow:hidden;background:var(--sp-card);border-radius:var(--sp-r)}

.about2__portrait img {width:100%;aspect-ratio:4 / 5;object-fit:cover;object-position:center top;display:block}


.about2__strip {width:100%;padding-bottom:clamp(48px, 7vw, 88px);overflow:hidden}

.about2__slide-track {display:flex;align-items:stretch;width:max-content;animation:img-slide 96s linear infinite}

.about2__slide-track:hover {animation-play-state:paused}

.about2__img {width:min(34vw, 520px);min-width:360px;flex:0 0 auto;overflow:hidden;border-block:2px solid var(--c-black);border-right:1px solid var(--sp-line);background:var(--sp-card)}

.about2__img:first-child {border-left:1px solid var(--sp-line)}


.about2__img img {width:100%;height:clamp(260px, 28vw, 420px);object-fit:cover;object-position:center center;display:block}

@keyframes img-slide {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}


@media (max-width: 768px) {
  .about2__top {grid-template-columns:1fr;gap:32px;margin-bottom:64px}
  .about2__portrait {max-width:420px}
}

@media (max-width: 640px) {
  .about2__img {width:78vw;min-width:260px}
  .about2__img img {height:260px}
}

/* Curriculum deliverables layout */
.curri__header {margin-bottom:0}

.curri__label {font-family:var(--font-mono);font-size:0.75rem;font-weight:700;letter-spacing:0.1em;color:var(--sp-em);display:block;margin-bottom:20px}

.curri__hero {display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:56px;line-height:1}

.curri__count {font-family:var(--font-mono);font-size:clamp(5rem, 12vw, 9rem);font-weight:700;line-height:1.2;color:inherit;flex-shrink:0}

.curri__title {font-size:clamp(1.5rem, 3vw, 2.25rem);font-weight:700;line-height:1.2;text-align:left}

.curri__list {display:flex;flex-direction:column}

.curri__item {border-top:1px solid var(--sp-line)}
.curri__item:last-child {border-bottom:1px solid var(--sp-line)}


.curri__item-head {padding-top:16px;padding-bottom:10px}

.curri__num {font-family:var(--font-mono);font-size:0.75rem;font-weight:700;letter-spacing:0.08em;color:var(--sp-em)}

.curri__item-body {display:grid;grid-template-columns:minmax(220px, 0.86fr) minmax(0, 1.14fr);column-gap:56px;row-gap:10px;padding-bottom:52px;align-items:start}

.curri__date {grid-column:1;grid-row:1}

.curri__item-title {grid-column:1;grid-row:2;font-size:clamp(1.125rem, 2vw, 1.5rem);font-weight:700;line-height:1.3;word-break:keep-all}

.curri__item-desc {grid-column:2;grid-row:2;font-size:0.9375rem;line-height:1.75;color:inherit;padding-top:0}

@media (max-width: 640px) {
  .curri__hero {flex-direction:column;align-items:flex-start}
  .curri__title {text-align:left}
  .curri__item-body {grid-template-columns:1fr;gap:12px}
  .curri__date,
  .curri__item-title,
  .curri__item-desc {grid-column:1;grid-row:auto}
}

/* Member tags */
.tag-grid {display:flex;flex-wrap:wrap;gap:10px}

.member-tag {display:inline-block;padding:8px 16px;font-size:0.875rem;font-weight:500;border:1px solid var(--sp-line);background:var(--sp-card);color:var(--sp-card-fg);box-shadow:var(--shadow-sm-b);word-break:keep-all;border-radius:var(--sp-r)}
.member-tag {transition:background var(--t-fast), color var(--t-fast), transform var(--t-fast)}
.member-tag:hover {background:var(--sp-acc);transform:translateY(-3px)}

/* Stat card */
.stat-card {padding:32px 28px;border:1px solid var(--sp-line);background:var(--sp-card);box-shadow:var(--shadow-b);border-radius:var(--sp-r)}

.stat-card__icon {font-size:1.5rem;margin-bottom:16px}
.stat-card__who {font-size:0.8125rem;color:var(--sp-sub);margin-bottom:12px;font-weight:500}
.stat-card__num {font-size:1.375rem;font-weight:800;color:var(--sp-em);line-height:1.3}

/* Quote card */
.quote-card {padding:28px;border:1px solid var(--sp-line);background:var(--sp-card);box-shadow:var(--shadow-b);display:flex;flex-direction:column;gap:16px;border-radius:var(--sp-r)}

.quote-card__who {display:flex;align-items:center;gap:10px}

.quote-card__dot {width:10px;height:10px;flex-shrink:0}

.quote-card__dot--purple {background:var(--sp-acc2)}
.quote-card__dot--yellow {background:var(--sp-acc);border:1px solid var(--sp-line);border-radius:var(--sp-r)}

.quote-card__label {font-size:0.75rem;font-weight:700;color:var(--sp-sub);letter-spacing:0.04em}

.quote-card__text {font-size:0.9375rem;line-height:1.8;color:inherit;word-break:keep-all}

/* Price ladder */
.price-ladder {display:flex;flex-wrap:wrap;align-items:center;gap:8px 4px;font-size:0.9375rem;font-weight:600}

.price-ladder__arrow {color:var(--sp-mut);font-size:0.875rem}

/* App features list */
.app-grid {display:grid;grid-template-columns:minmax(0, 1fr) minmax(340px, 0.9fr);gap:64px;align-items:center}

.app-showcase {display:grid;gap:28px}

.app-shot {width:min(100%, 420px);margin:0 auto;overflow:hidden;border:1px solid var(--sp-line);background:var(--sp-card);box-shadow:var(--sp-lift);border-radius:var(--sp-r)}

.app-shot img {width:100%;display:block}

.app-shot figcaption {padding:14px 16px;font-size:0.8125rem;font-weight:600;line-height:1.55;color:var(--sp-sub);word-break:keep-all;border-top:1px solid var(--sp-line)}

.feature-list {display:flex;flex-direction:column;gap:0}

.feature-list__item {display:grid;grid-template-columns:28px 1fr;gap:16px;align-items:start;padding-block:20px;border-top:1px solid var(--sp-line)}
.feature-list__item:last-child {border-bottom:1px solid var(--sp-line)}

.feature-list__num {font-size:0.75rem;font-weight:700;color:var(--sp-em);letter-spacing:0.08em;padding-top:2px}

/* feature-list emoji hover */
.feature-list__item--emoji {position:relative;overflow:hidden;cursor:default}

.feature-list__item--emoji::after {content:attr(data-emoji);position:absolute;right:0;top:50%;transform:translateY(-50%) translateX(20px) scale(0.6);font-size:1.75rem;opacity:0;transition:opacity 0.25s ease, transform 0.3s cubic-bezier(0.22, 1, 0.36, 1);pointer-events:none;line-height:1}

.feature-list__item--emoji:hover::after {opacity:1;transform:translateY(-50%) translateX(0) scale(1)}

.feature-list__item--emoji:hover .feature-list__num,
.feature-list__item--emoji:hover .feature-list__text {transform:translateX(-4px);transition:transform 0.25s ease}

/* feature-list on white bg */
.feature-list--dark .feature-list__item {border-top-color:rgba(13,13,13,0.12);color:inherit}
.feature-list--dark .feature-list__item:last-child {border-bottom-color:rgba(13,13,13,0.12)}
.feature-list--dark .feature-list__num {color:inherit}
.feature-list--dark .feature-list__text {color:inherit}

.feature-list__text {font-size:1rem;color:inherit;line-height:1.7}

@media (max-width: 900px) {
  .app-grid {grid-template-columns:1fr;gap:44px}

  .app-shot {margin-inline:0}
}

@media (max-width: 640px) {
  .app-shot {width:100%;box-shadow:var(--sp-lift);border-radius:var(--sp-r)}
}

/* Letter vol cards */
.vol-card {padding:24px;border:1px solid var(--sp-line);background:var(--sp-card);box-shadow:var(--shadow-b);text-decoration:none;color:var(--sp-card-fg);display:block;transition:transform var(--t-fast), box-shadow var(--t-fast);border-radius:var(--sp-r)}
.vol-card:hover {transform:translateY(-3px);box-shadow:var(--sp-lift);border-radius:var(--sp-r)}

.vol-card__num {font-size:0.6875rem;font-weight:700;letter-spacing:0.14em;text-transform:uppercase;color:var(--sp-em);margin-bottom:8px}

.vol-card__title {font-size:1rem;font-weight:700;line-height:1.4;word-break:keep-all}

.vol-card__excerpt {font-size:0.875rem;line-height:1.6;color:var(--sp-sub);word-break:keep-all;margin-top:8px}

/* Form */
.form {display:flex;flex-direction:column;gap:16px}

.form__label {display:block;font-size:0.8125rem;font-weight:700;margin-bottom:6px;letter-spacing:0.02em}

.form__field {display:flex;flex-direction:column}

.form__checkbox {display:flex;align-items:flex-start;gap:12px;font-size:0.875rem;line-height:1.6}

.form__checkbox input[type="checkbox"] {width:18px;height:18px;flex-shrink:0;margin-top:2px;accent-color:var(--c-purple);cursor:pointer}

/* 동의 체크박스 (개인정보·광고성) — 폼 공통 */
.ln-consent {width:100%;display:flex;flex-direction:column;gap:8px;margin:14px 0 4px;text-align:left}
.ln-consent label {display:flex;gap:8px;align-items:flex-start;font-size:0.8125rem;line-height:1.5;word-break:keep-all;cursor:pointer;color:inherit}
.ln-consent input[type="checkbox"] {width:16px;height:16px;flex:0 0 auto;margin-top:3px;accent-color:var(--c-purple);cursor:pointer}
.ln-consent a {color:inherit;text-decoration:underline}

/* Events page specifics */
.process-step {display:grid;grid-template-columns:64px 1fr;gap:24px;padding-block:32px;border-top:1px solid var(--sp-line);align-items:start}
.process-step:last-child {border-bottom:1px solid var(--sp-line)}

.process-step__num {font-size:2rem;font-weight:800;color:var(--sp-em);line-height:1}

.process-step h3 {margin-bottom:8px}
.process-step p {font-size:0.9375rem;color:var(--sp-sub);line-height:1.75}

/* Portfolio grid */
.portfolio-item {padding:24px;border:1px solid var(--sp-line);background:var(--sp-card);box-shadow:var(--shadow-sm-b);border-radius:var(--sp-r)}

.portfolio-item--link {display:block;text-decoration:none;color:inherit;transition:transform var(--t-fast), box-shadow var(--t-fast)}
.portfolio-item--link:hover {transform:translateY(-3px);box-shadow:var(--sp-lift);border-radius:var(--sp-r)}

.portfolio-item__tag {font-size:0.6875rem;font-weight:700;letter-spacing:0.1em;text-transform:uppercase;color:var(--sp-em);margin-bottom:8px}

.portfolio-item h3 {font-size:1rem;font-weight:700;word-break:keep-all}

/* About page */
.about-intro {font-size:clamp(1.125rem, 2.5vw, 1.375rem);line-height:1.85;word-break:keep-all}

/* Utility */
.mt-4  {margin-top:4px}
.mt-8  {margin-top:8px}
.mt-12 {margin-top:12px}
.mt-16 {margin-top:16px}
.mt-24 {margin-top:24px}
.mt-32 {margin-top:32px}
.mt-48 {margin-top:48px}
.mt-64 {margin-top:64px}

.mb-4  {margin-bottom:4px}
.mb-8  {margin-bottom:8px}
.mb-12 {margin-bottom:12px}
.mb-16 {margin-bottom:16px}
.mb-24 {margin-bottom:24px}
.mb-32 {margin-bottom:32px}
.mb-48 {margin-bottom:48px}
.mb-64 {margin-bottom:64px}

.gap-8  {gap:8px}
.gap-12 {gap:12px}
.gap-16 {gap:16px}
.gap-24 {gap:24px}
.gap-32 {gap:32px}
.gap-48 {gap:48px}

.text-center {text-align:center}

/* Print / accessibility */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {transition-duration:0.01ms !important}
  html {scroll-behavior:auto}
  /* 사진 갤러리(브랜드 자산)는 동작 줄이기에서도 부드럽게 계속 흐르게 둠 */
}

/* ============================================
   Polish pass — 2026-07 (시스템 불변, 마감만)
   ============================================ */

/* 홈 히어로 2단: 우측 3축 스택 (데스크톱 전용) */
.hero2 {display:grid;grid-template-columns:1fr;gap:48px;align-items:center}
.hero2__pillars {display:none}
@media (min-width: 1024px) {
  .hero2 {grid-template-columns:1.25fr 0.75fr}
  .hero2__pillars {display:flex;flex-direction:column;gap:24px;justify-self:end;padding-right:14px}
  .hero-pillar {display:flex;flex-direction:column;gap:3px;background:var(--sp-card);color:var(--sp-card-fg);border:var(--border);padding:18px 22px;width:280px;box-shadow:var(--shadow-b)}
  .hero-pillar__num {font-size:0.6875rem;font-weight:800;letter-spacing:0.12em;color:var(--sp-em)}
  .hero-pillar__t {font-size:1.25rem;font-weight:800;letter-spacing:-0.01em}
  .hero-pillar__d {font-size:0.875rem;color:var(--sp-sub)}
  .hero-pillar--1 {transform:rotate(-2deg)}
  .hero-pillar--2 {transform:rotate(1.6deg) translateX(28px);box-shadow:var(--shadow-y)}
  .hero-pillar--3 {transform:rotate(-1.2deg)}
}

/* 현장 사진 톤 통일 — 채도 살짝 낮추고 대비 정돈 */
.about2__img img {filter:saturate(0.92) contrast(1.04)}
.about2__portrait img {filter:saturate(0.94) contrast(1.03)}

/* 하단 고정 CTA — 브루탈 마감 (블랙 톱보더) */
.sticky-cta {border-top:1px solid var(--sp-line)}

/* === NAV 드롭다운 (의뢰하기: AX / 오프라인 행사) — 2026-08-30 === */
.nav__has-sub {position:relative}

.nav__has-sub > a::before {content:"";position:absolute;right:2px;top:50%;width:5px;height:5px;margin-top:-3px;border-right:1px solid var(--sp-line);border-bottom:1px solid var(--sp-line);transform:rotate(45deg);opacity:0.6}
.nav__has-sub > a {padding-right:20px}

.nav__sub {position:absolute;top:100%;left:0;min-width:232px;background:var(--sp-card);border:1px solid var(--sp-line);list-style:none;padding:6px;margin-top:6px;opacity:0;visibility:hidden;transform:translateY(-4px);transition:opacity var(--t-fast), transform var(--t-fast), visibility var(--t-fast);box-shadow:none}

.nav__has-sub:hover .nav__sub,
.nav__has-sub:focus-within .nav__sub {opacity:1;visibility:visible;transform:translateY(0)}

.nav__sub a {display:block;padding:11px 14px;white-space:nowrap;font-size:0.875rem}
.nav__sub a::after {display:none}
.nav__sub a:hover {background:var(--sp-soft)}

/* 모바일 메뉴의 '의뢰하기' 그룹 */
.nav__mobile-label {padding:14px 0 4px;font-size:0.75rem;font-weight:700;letter-spacing:0.1em;color:var(--sp-mut);text-transform:uppercase}
.nav__mobile a.nav__mobile-sub {padding:12px 0 12px 14px;font-size:1rem;border-left:1px solid var(--sp-line);border-bottom:1px solid var(--sp-line)}

/* 어두운 섹션용 태그 변형 (ax.html '이런 것들도 만들었습니다') — 2026-08-30 */
.member-tag--dark {border-color:var(--sp-line);background:transparent;color:var(--sp-sub);box-shadow:none}
.member-tag--dark:hover {background:var(--sp-acc);color:var(--sp-acc-fg);border-color:var(--sp-line)}

/* 태그 마퀴 (ax.html '이런 것들도 만듭니다') — 2026-08-30 */
@keyframes tag-marquee-ltr {
  0%   { transform: translateX(-50%); }
  100% { transform: translateX(0); }
}
@keyframes tag-marquee-rtl {
  0%   { transform: translateX(0); }
  100% { transform: translateX(-50%); }
}
.tag-marquee {overflow:hidden;padding-block:5px}
.tag-marquee__track {display:flex;gap:10px;width:max-content;animation-timing-function:linear;animation-iteration-count:infinite}
.tag-marquee__track--ltr {animation-name:tag-marquee-ltr}
.tag-marquee__track--rtl {animation-name:tag-marquee-rtl}
.tag-marquee:hover .tag-marquee__track {animation-play-state:paused}
.tag-marquee__item {flex-shrink:0}
@media (prefers-reduced-motion: reduce) {
  .tag-marquee__track {animation:none}
  .tag-marquee {overflow-x:auto}
}

/* 해결 과정 흐름 (ax.html 제작 유형 카드) — 2026-08-30 */
.flow {list-style:none;margin:0;padding:0 0 0 18px;border-left:1px solid var(--sp-line)}
.flow__step {position:relative;font-size:0.875rem;line-height:1.6;color:var(--sp-sub);padding-block:7px;word-break:keep-all}
.flow__step::before {content:"";position:absolute;left:-23px;top:15px;width:7px;height:7px;background:rgba(245, 245, 240, 0.32);border-radius:50%}
.flow__step:last-child {color:inherit;font-weight:700}
.flow__step:last-child::before {background:var(--sp-acc);width:9px;height:9px;left:-24px}

/* ===== 히어로 H1 — 커뮤니티 키워드 강조 =====
   첫 줄은 입체 그림자, 둘째 줄은 반전 블록으로 같은 단어의 역할을 구분한다.
   GET100만 브랜드 노란색을 유지한다.
   ============================================================ */
.hero-h1 {font-size:clamp(2.4rem, 5.4vw, 4.75rem);line-height:1.08;letter-spacing:-0.045em;word-break:keep-all}
.hero-h1__line {display:block;white-space:nowrap}
.hero-h1__line + .hero-h1__line {margin-top:0.1em}
.hero-h1__keyword--shadow {color:inherit;font-weight:800;letter-spacing:-0.055em;text-shadow:0.075em 0.075em 0 rgba(13, 13, 13, 0.28)}
.hero-h1__support {color:var(--sp-sub);font-size:0.72em;font-weight:650;vertical-align:0.08em}
.hero-h1__keyword--block {display:inline-block;color:var(--sp-em);background:var(--sp-card);font-weight:800;letter-spacing:-0.055em;padding:0.01em 0.13em 0.04em;line-height:1.02;box-shadow:0.07em 0.07em 0 rgba(13, 13, 13, 0.28)}
.hero-h1__comma {color:inherit;font-weight:800}
.hero-h1__brand {color:var(--sp-em);font-weight:800}
@media (max-width: 640px) {
  .hero-h1 {font-size:clamp(1.82rem, 8.45vw, 2.2rem)}
  .hero-h1__support {font-size:0.58em}
  .hero-h1__keyword--block {padding-inline:0.1em}
}

/* 2026-10-10 새 로고: 고리 달린 별 심볼 (자산/brand/logo-2026-10) */
.nav__logo {display:inline-flex;align-items:center}
.nav__logo::before {content:"";width:1.5em;height:1.5em;flex:none;margin-right:0.36em;background:url("/logo-symbol.svg?v=20261010") center / contain no-repeat}