:root {
  --text: #0B0B0A;
  --muted: #6B6F6A;
  --faint: #6B6F6A;
  --yellow: #FFC71A;
  --yellow-soft: #F4F4F1;
  --green: #1F7A3A;
  --bg: #ffffff;
  --bg-alt: #F4F4F1;
  --card: #ffffff;
  --border: #ececec;
  --dark: #0B0B0A;
  --radius: 2px;
  --shadow: none;
  --container: 1160px;
}

* { box-sizing: border-box; }

html { scroll-behavior: auto; scroll-padding-top: 100px; }

body {
  margin: 0;
  font-family: "Pretendard", "Apple SD Gothic Neo", -apple-system, "Malgun Gothic", sans-serif;
  color: var(--text);
  background: var(--bg);
  line-height: 1.75;
  word-break: keep-all;
  -webkit-font-smoothing: antialiased;
}

img { max-width: 100%; height: auto; }

.container {
  max-width: var(--container);
  margin: 0 auto;
  padding: 0 32px;
}

/* ───── 타이포 ───── */
h1, h2, h3 { letter-spacing: -0.02em; }

h1 {
  font-size: clamp(2.3rem, 5.5vw, 4rem);
  line-height: 1.25;
  font-weight: 800;
  margin: 0;
}

h2 {
  font-size: clamp(1.6rem, 3vw, 2.25rem);
  line-height: 1.4;
  font-weight: 800;
  margin: 0 0 1rem;
}

h3 { font-size: 1.15rem; font-weight: 700; margin: 0 0 0.4rem; }

.section-lead {
  color: var(--muted);
  font-size: 1.05rem;
  max-width: 560px;
  margin: 0 0 3.5rem;
}

/* ───── 버튼 ───── */
.btn {
  display: inline-block;
  padding: 0.9rem 2rem;
  border-radius: 999px;
  text-decoration: none;
  font-weight: 700;
  font-size: 1rem;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}
.btn:hover { transform: translateY(-2px); box-shadow: var(--shadow); }
.btn-primary { background: var(--yellow); color: var(--text); }
.btn-ghost { background: transparent; color: var(--text); border: 1.5px solid var(--text); }
.btn-dark { background: var(--text); color: #fff; }
.btn-sm { padding: 0.5rem 1.2rem; font-size: 0.9rem; }

/* ───── 헤더 ───── */
.site-header {
  position: sticky;
  top: 0;
  background: rgba(255, 255, 255, 0.85);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  border-bottom: 1px solid var(--border);
  z-index: 10;
}
.site-header nav {
  max-width: var(--container);
  margin: 0 auto;
  padding: 0 32px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 76px;
}
.site-header .logo { display: flex; align-items: center; }
.site-header .logo img { height: 38px; width: auto; }
.site-header ul {
  display: flex;
  align-items: center;
  gap: 2.25rem;
  list-style: none;
  margin: 0;
  padding: 0;
}
.site-header ul a:not(.btn) {
  color: var(--text);
  text-decoration: none;
  font-weight: 600;
  font-size: 0.98rem;
}
.site-header ul a:not(.btn):hover { color: var(--green); }
.site-header ul a[aria-current="page"] { color: var(--green); }

/* ───── 드롭다운 하위메뉴 ───── */
.site-header li.has-sub { position: relative; }
.site-header li.has-sub > a:not(.btn)::after {
  content: "";
  display: inline-block;
  width: 0; height: 0;
  margin-left: 0.34rem;
  vertical-align: 0.12em;
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  border-top: 5px solid currentColor;
  opacity: 0.55;
  transition: transform 0.18s ease;
}
.site-header li.has-sub:hover > a:not(.btn)::after { transform: rotate(180deg); }
.site-header .submenu {
  position: absolute;
  top: 100%;
  left: 50%;
  margin-top: 14px;
  min-width: 232px;
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 14px;
  box-shadow: var(--shadow);
  padding: 0.5rem;
  list-style: none;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0.1rem;
  opacity: 0;
  visibility: hidden;
  transform: translateX(-50%) translateY(6px);
  transition: opacity 0.18s ease, transform 0.18s ease;
  z-index: 30;
}
.site-header .submenu::before { /* 호버 브리지 (메뉴와 트리거 사이 간격 메움) */
  content: "";
  position: absolute;
  top: -16px; left: 0; right: 0; height: 16px;
}
.site-header li.has-sub:hover .submenu,
.site-header li.has-sub:focus-within .submenu {
  opacity: 1;
  visibility: visible;
  transform: translateX(-50%) translateY(0);
}
.site-header .submenu li { margin: 0; }
.site-header .submenu a:not(.btn) {
  display: block;
  padding: 0.6rem 0.9rem;
  border-radius: 9px;
  font-size: 0.92rem;
  font-weight: 600;
  white-space: nowrap;
  text-align: left;
  color: var(--text);
}
.site-header .submenu a:not(.btn):hover { background: var(--bg-alt); color: var(--green); }

/* ───── 섹션 공통 ───── */
.section { padding: 7rem 0; }
.section-alt { background: var(--bg-alt); }
.section-dark { background: var(--dark); color: #fff; }

.eyebrow {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  margin: 0 0 1rem;
  font-size: 0.82rem;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--green);
}
.eyebrow::before {
  content: "";
  width: 22px;
  height: 3px;
  border-radius: 2px;
  background: var(--yellow);
}
.center .eyebrow { justify-content: center; }
.center { text-align: center; }
.center .section-lead { margin-left: auto; margin-right: auto; }

/* ───── 히어로 ───── */
.hero {
  position: relative;
  overflow: hidden;
  padding: 9rem 0 7rem;
  text-align: center;
  background:
    radial-gradient(ellipse 60% 50% at 50% -10%, rgba(245, 197, 24, 0.13), transparent),
    var(--bg);
}
.hero .container { position: relative; z-index: 2; }
.hero-media { position: absolute; inset: 0; z-index: 0; }
.hero-video {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0;
  transition: opacity 0.9s ease;
}
.hero-video.is-active { opacity: 1; }
.hero-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    to bottom,
    rgba(255, 255, 255, 0.82) 0%,
    rgba(255, 255, 255, 0.62) 45%,
    rgba(255, 255, 255, 0.88) 85%,
    var(--bg) 100%
  );
}
@media (prefers-reduced-motion: reduce) {
  .hero-video { display: none; }
  .hero-media { background: url("../assets/hero_poster.jpg") center/cover; }
}
.hero-badge {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.4rem 1.1rem;
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 999px;
  font-size: 0.88rem;
  font-weight: 600;
  color: var(--muted);
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.04);
  margin: 0 0 2rem;
}
.hero-badge::before {
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--green);
}
.hero h1 { margin-bottom: 1.75rem; }
.hero-sub {
  color: var(--muted);
  font-size: clamp(1.05rem, 1.6vw, 1.2rem);
  margin: 0 auto;
  max-width: 640px;
}
.hero-sub strong { color: var(--text); }
.hero-cta {
  display: flex;
  gap: 0.9rem;
  justify-content: center;
  flex-wrap: wrap;
  margin-top: 3rem;
}

/* ───── 함께한 곳 ───── */
.partners { padding: 3.5rem 0 4.5rem; border-bottom: 1px solid var(--border); }
.partners-label {
  text-align: center;
  font-size: 0.82rem;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--faint);
  margin: 0 0 1.75rem;
}
.partner-row {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 1rem 3.5rem;
  list-style: none;
  margin: 0;
  padding: 0;
  color: var(--faint);
  font-weight: 800;
  font-size: 1.05rem;
  letter-spacing: -0.01em;
}
.partner-row li { opacity: 0.75; transition: opacity 0.2s; }
.partner-row li:hover { opacity: 1; color: var(--muted); }

/* ───── 카드 ───── */
.card-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: 1.5rem;
}
.card {
  position: relative;
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 2.25rem 2rem;
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.card:hover { transform: translateY(-6px); box-shadow: var(--shadow); }
.section-alt .card { border-color: transparent; }
.card p { color: var(--muted); font-size: 0.97rem; margin: 0.5rem 0 1.25rem; }

.icon-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 52px;
  height: 52px;
  border-radius: 16px;
  background: var(--yellow-soft);
  color: var(--text);
  margin-bottom: 1.4rem;
}
.icon-chip svg { width: 24px; height: 24px; }

.card-link {
  color: var(--text);
  font-weight: 700;
  text-decoration: none;
  font-size: 0.95rem;
  border-bottom: 2px solid var(--yellow);
  padding-bottom: 2px;
}
.card-link:hover { color: var(--green); border-color: var(--green); }

.badge {
  position: absolute;
  top: 1.5rem;
  right: 1.5rem;
  padding: 0.2rem 0.75rem;
  background: var(--text);
  color: var(--yellow);
  border-radius: 999px;
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.02em;
}

/* ───── 필러 ───── */
.pillar-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 3rem;
  margin-top: 4rem;
}
.pillar { border-top: 1px solid var(--border); padding-top: 1.75rem; }
.pillar-num {
  display: block;
  font-size: 0.95rem;
  font-weight: 800;
  color: var(--green);
  letter-spacing: 0.12em;
  margin-bottom: 0.75rem;
}
.pillar h3 { font-size: 1.5rem; letter-spacing: -0.01em; }
.pillar p { color: var(--muted); font-size: 0.98rem; margin: 0.5rem 0 0; }

/* ───── 프로세스 ───── */
.steps {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
  gap: 1.5rem;
  list-style: none;
  margin: 0;
  padding: 0;
}
.steps li {
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 2rem 1.75rem;
}
.section-alt .steps li { border-color: transparent; }
.step-num {
  display: block;
  font-size: 2.4rem;
  font-weight: 800;
  letter-spacing: -0.02em;
  color: var(--yellow);
  line-height: 1;
  margin-bottom: 1.1rem;
}
.steps h3 { font-size: 1.08rem; }
.steps p { color: var(--muted); font-size: 0.93rem; margin: 0.3rem 0 0; }

/* ───── 미션 (다크) ───── */
.mission { text-align: center; padding: 8rem 0; }
.mission blockquote { margin: 0; }
.mission p {
  font-size: clamp(1.5rem, 3.6vw, 2.5rem);
  font-weight: 800;
  letter-spacing: -0.02em;
  line-height: 1.55;
  margin: 0;
  color: #fff;
}
.mission mark {
  background: none;
  color: var(--yellow);
}
.mission-sub {
  color: rgba(255, 255, 255, 0.55) !important;
  font-size: 1rem !important;
  font-weight: 500 !important;
  letter-spacing: 0 !important;
  margin-top: 1.75rem !important;
}

/* ───── FAQ ───── */
.faq-list { max-width: 760px; }
details {
  border-bottom: 1px solid var(--border);
  padding: 1.1rem 0;
}
details summary {
  cursor: pointer;
  font-weight: 700;
  font-size: 1.05rem;
  list-style: none;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
details summary::-webkit-details-marker { display: none; }
details summary::after {
  content: "+";
  font-size: 1.4rem;
  font-weight: 400;
  color: var(--faint);
  transition: transform 0.2s;
}
details[open] summary::after { transform: rotate(45deg); }
details p { color: var(--muted); margin: 0.75rem 0 0.25rem; }
details a { color: var(--green); }

/* ───── CTA 배너 ───── */
.cta-banner { text-align: center; padding: 7.5rem 0; }
.cta-banner h2 { font-size: clamp(1.7rem, 3.4vw, 2.5rem); }
.cta-banner p { color: var(--muted); margin: 0 0 2.5rem; font-size: 1.05rem; }

/* ───── 서브페이지 ───── */
.page-head { padding: 5.5rem 0 1rem; }
.page-head h1 { font-size: clamp(2rem, 4vw, 3rem); }
.page-head p { color: var(--muted); font-size: 1.05rem; margin: 1rem 0 0; }

article ul { color: var(--muted); padding-left: 1.2rem; }
article ul li { margin-bottom: 0.3rem; }
article strong { color: var(--text); }
.post-list { padding-left: 1.2rem; color: var(--muted); }
.post-list li { margin-bottom: 0.6rem; }

/* ───── 푸터 ───── */
.site-footer {
  background: var(--bg-alt);
  border-top: 1px solid var(--border);
  padding: 4.5rem 0 0;
  margin-top: 0;
}
.footer-grid {
  display: grid;
  grid-template-columns: 2fr 1fr 1fr;
  gap: 3rem;
  padding-bottom: 3.5rem;
}
.footer-brand p {
  color: var(--muted);
  font-size: 0.95rem;
  max-width: 320px;
  margin: 1.25rem 0 0;
}
.footer-logo { height: 34px; width: auto; }
.footer-col h4 {
  font-size: 0.82rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--faint);
  margin: 0.4rem 0 1.1rem;
}
.footer-col ul { list-style: none; margin: 0; padding: 0; }
.footer-col li { margin-bottom: 0.6rem; }
.footer-col a {
  color: var(--muted);
  text-decoration: none;
  font-size: 0.95rem;
}
.footer-col a:hover { color: var(--text); }
.footer-bottom {
  border-top: 1px solid var(--border);
  padding: 1.5rem 0;
  color: var(--faint);
  font-size: 0.85rem;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 0.5rem;
}

/* ───── 비교 테이블 ───── */
.compare-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.97rem;
}
.compare-table th, .compare-table td {
  padding: 1rem 1.25rem;
  text-align: left;
  border-bottom: 1px solid var(--border);
}
.compare-table thead th {
  font-size: 0.82rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--faint);
}
.compare-table td:first-child { color: var(--muted); font-weight: 600; white-space: nowrap; }
.compare-table .highlight-col { background: var(--yellow-soft); font-weight: 600; }

/* ───── 스킬 리스트 카드 ───── */
.card .skill-list {
  list-style: none;
  padding: 0;
  margin: 0.75rem 0 0;
  color: var(--muted);
  font-size: 0.95rem;
}
.card .skill-list li {
  padding: 0.45rem 0 0.45rem 1.4rem;
  position: relative;
  border-bottom: 1px solid var(--border);
}
.card .skill-list li:last-child { border-bottom: none; }
.card .skill-list li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 1rem;
  width: 7px;
  height: 7px;
  border-radius: 2px;
  background: var(--yellow);
}
.card-label {
  display: inline-block;
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--green);
  margin-bottom: 0.5rem;
}

/* ───── 요금 카드 ───── */
.price-card {
  max-width: 560px;
  margin: 0 auto;
  background: var(--dark);
  color: #fff;
  border-radius: var(--radius);
  padding: 3rem 2.5rem;
  text-align: center;
}
.price-card .price {
  font-size: clamp(2.2rem, 4vw, 3rem);
  font-weight: 800;
  letter-spacing: -0.02em;
  margin: 0.5rem 0 0.25rem;
}
.price-card .price small { font-size: 1rem; font-weight: 600; color: rgba(255,255,255,0.6); }
.price-card .price-note { color: rgba(255,255,255,0.6); font-size: 0.95rem; margin: 0 0 1.75rem; }
.price-card ul {
  list-style: none;
  margin: 0 0 2rem;
  padding: 1.5rem 0 0;
  border-top: 1px solid rgba(255,255,255,0.15);
  text-align: left;
  font-size: 0.97rem;
}
.price-card ul li {
  padding: 0.4rem 0 0.4rem 1.6rem;
  position: relative;
  color: rgba(255,255,255,0.85);
}
.price-card ul li::before {
  content: "✓";
  position: absolute;
  left: 0;
  color: var(--yellow);
  font-weight: 800;
}

/* ───── 적합/부적합 ───── */
.fit-list { list-style: none; margin: 0.75rem 0 0; padding: 0; color: var(--muted); font-size: 0.97rem; }
.fit-list li { padding: 0.45rem 0 0.45rem 1.8rem; position: relative; }
.fit-list.yes li::before { content: "✓"; position: absolute; left: 0; color: var(--green); font-weight: 800; }
.fit-list.no li::before { content: "✕"; position: absolute; left: 0; color: var(--faint); font-weight: 800; }

/* ───── 회사소개: 대표 프로필 ───── */
.profile-grid {
  display: grid;
  grid-template-columns: 340px 1fr;
  gap: 4rem;
  align-items: start;
}
.profile-photo {
  width: 100%;
  border-radius: var(--radius);
  display: block;
}
.profile-name { font-size: 1.6rem; font-weight: 800; margin: 0 0 0.2rem; }
.profile-title { color: var(--green); font-weight: 700; margin: 0 0 1.5rem; }
.profile-bio p { color: var(--muted); margin: 0 0 1rem; }
.profile-bio strong { color: var(--text); }
.profile-links { display: flex; gap: 0.75rem; flex-wrap: wrap; margin-top: 1.75rem; }

.timeline { list-style: none; margin: 2rem 0 0; padding: 0; }
.timeline li {
  position: relative;
  padding: 0 0 1.5rem 1.9rem;
  border-left: 2px solid var(--border);
  margin-left: 0.4rem;
}
.timeline li:last-child { padding-bottom: 0; }
.timeline li::before {
  content: "";
  position: absolute;
  left: -7px;
  top: 0.4rem;
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: var(--yellow);
  border: 2px solid #fff;
}
.timeline h3 { font-size: 1.02rem; margin: 0 0 0.15rem; }
.timeline p { color: var(--muted); font-size: 0.93rem; margin: 0; }
.timeline .period { font-size: 0.8rem; font-weight: 700; color: var(--faint); letter-spacing: 0.06em; }

/* ───── 숫자 스탯 ───── */
.stats-row {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 1.5rem;
  text-align: center;
}
.stat .stat-num {
  display: block;
  font-size: clamp(2.2rem, 4vw, 3rem);
  font-weight: 800;
  letter-spacing: -0.02em;
  color: var(--text);
}
.stat .stat-num em { font-style: normal; color: var(--yellow); }
.stat .stat-label { color: var(--muted); font-size: 0.95rem; }

@media (max-width: 860px) {
  .profile-grid { grid-template-columns: 1fr; gap: 2rem; }
  .profile-photo { max-width: 320px; }
}

/* ───── 후기 ───── */
.quote-card { background: var(--card); border: 1px solid var(--border); border-radius: var(--radius); padding: 2rem; }
.quote-card p { color: var(--text); font-weight: 600; margin: 0 0 0.75rem; }
.quote-card cite { color: var(--faint); font-style: normal; font-size: 0.9rem; }

/* ───── 사례 페이지: 히어로 ───── */
.case-hero {
  position: relative;
  overflow: hidden;
  padding: 5.5rem 0 4.5rem;
  background:
    radial-gradient(ellipse 55% 60% at 85% 20%, rgba(245, 197, 24, 0.14), transparent),
    radial-gradient(ellipse 50% 55% at 10% 90%, rgba(47, 168, 79, 0.08), transparent),
    var(--bg);
}
.case-hero-inner {
  display: grid;
  grid-template-columns: 1.05fr 0.95fr;
  gap: 3.5rem;
  align-items: center;
}
.case-hero-text h1 { margin: 0 0 1.5rem; }
.case-hero-text > p { color: var(--muted); font-size: 1.08rem; margin: 0 0 2.25rem; }
.case-hero-text .hero-cta { justify-content: flex-start; margin-top: 0; }
.case-hero-media img {
  width: 100%;
  border-radius: var(--radius);
  display: block;
  box-shadow: var(--shadow);
}

/* ───── 실적 밴드 ───── */
.proof-band { padding: 3.5rem 0; }

/* ───── 사례 카드 ───── */
.case-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(290px, 1fr));
  gap: 1.5rem;
  margin-top: 2.5rem;
}
.case-card {
  position: relative;
  display: flex;
  flex-direction: column;
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 2rem 1.9rem 2.1rem;
  overflow: hidden;
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.case-card::before {
  content: "";
  position: absolute;
  top: 0; left: 0;
  width: 100%; height: 4px;
  background: linear-gradient(90deg, var(--yellow), var(--green));
}
.case-card:hover { transform: translateY(-6px); box-shadow: var(--shadow); }
.case-cat {
  display: inline-block;
  font-size: 0.76rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--green);
  margin-bottom: 0.5rem;
}
.case-head h3 { font-size: 1.3rem; margin: 0; }
.case-metric {
  display: flex;
  align-items: baseline;
  gap: 0.6rem;
  margin: 1.25rem 0 1rem !important;
  padding: 1rem 0 0;
  border-top: 1px solid var(--border);
}
.case-metric .metric-num {
  font-size: clamp(2rem, 4vw, 2.6rem);
  font-weight: 800;
  letter-spacing: -0.02em;
  color: var(--text);
  line-height: 1;
}
.case-metric .metric-unit { color: var(--faint); font-size: 0.9rem; font-weight: 600; }
.case-desc { color: var(--muted) !important; font-size: 0.95rem; margin: 0 !important; }
.case-more {
  margin: 2.5rem 0 0;
  padding: 1.4rem 1.6rem;
  background: var(--bg-alt);
  border-radius: 16px;
  color: var(--muted);
  font-size: 0.96rem;
}
.case-more strong { color: var(--text); }

/* ───── 브랜드 월 ───── */
.brand-wall-sec .section-lead { margin-bottom: 2.5rem; }
.brand-wall {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.75rem;
  list-style: none;
  margin: 0;
  padding: 0;
}
.brand-wall li {
  padding: 0.6rem 1.25rem;
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 999px;
  font-weight: 700;
  font-size: 0.95rem;
  color: var(--muted);
  transition: color 0.2s, border-color 0.2s, transform 0.2s;
}
.brand-wall li:hover { color: var(--text); border-color: var(--yellow); transform: translateY(-2px); }

/* ───── 브랜드 로고 월 (실제 로고) ───── */
.brand-logos {
  margin: 2.5rem auto 0;
  max-width: 960px;
  background: #fff;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 2.5rem 2.25rem;
  box-shadow: var(--shadow);
}
.brand-logos img { display: block; width: 100%; height: auto; }
.brand-extra { color: var(--muted); font-size: 0.95rem; margin: 1.75rem auto 0; max-width: 760px; }

/* ───── 실무 대시보드 figure ───── */
.dashboard-figure {
  margin: 2.5rem 0 0;
  border-radius: var(--radius);
  overflow: hidden;
  border: 1px solid var(--border);
  background: #fff;
}
.dashboard-figure img { display: block; width: 100%; height: auto; }
.dashboard-figure figcaption {
  padding: 0.95rem 1.4rem;
  background: var(--card);
  color: var(--muted);
  font-size: 0.9rem;
  border-top: 1px solid var(--border);
}

/* ───── 스토리: 공감(고민) 카드 ───── */
.pain-card h3 { font-size: 1.06rem; line-height: 1.55; color: var(--text); }
.pain-card h3::before {
  content: "\201C";
  color: var(--yellow);
  font-weight: 800;
  font-size: 1.4em;
  line-height: 0;
  margin-right: 0.12rem;
  vertical-align: -0.2em;
}
.pain-card p { margin-top: 0.6rem !important; }

/* ───── 스토리: 다크 스테이트먼트 ───── */
.section-dark .eyebrow { color: var(--yellow); justify-content: center; }
.statement { text-align: center; }
.statement .big {
  font-size: clamp(1.55rem, 3.6vw, 2.5rem);
  font-weight: 800;
  line-height: 1.5;
  letter-spacing: -0.02em;
  margin: 0.5rem 0 0;
  color: #fff;
}
.statement .big mark { background: none; color: var(--yellow); }
.statement .sub {
  color: rgba(255, 255, 255, 0.6);
  font-size: 1.05rem;
  margin: 1.5rem auto 0;
  max-width: 640px;
}

/* 해결자 밴드: 가운데 정렬 stats */
.proof-band.center .stats-row { margin-top: 3rem; }

/* ───── 스토리: 반론 처리 ───── */
.reassure {
  margin: 2.5rem auto 0;
  max-width: 760px;
  text-align: center;
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  padding: 2.25rem 2rem;
}
.reassure h3 { font-size: 1.2rem; margin: 0 0 0.6rem; }
.reassure p { color: var(--muted); margin: 0; }
.reassure strong { color: var(--text); }

/* ───── 스토리: 긴급성 ───── */
.urgency {
  margin: 1.75rem auto 0;
  max-width: 560px;
  color: var(--muted);
  font-size: 0.95rem;
}

/* ───── 비주얼 밴드 (컨테이너 폭 제한 — 큰 화면에서 늘어나지 않게) ───── */
.photo-band {
  max-width: var(--container);
  margin: 1.5rem auto;
  padding: 0 32px;
}
.photo-band img {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  max-height: 600px;
  object-fit: cover;
  border-radius: var(--radius);
  box-shadow: var(--shadow);
}
@media (max-width: 720px) {
  .photo-band { padding: 0 20px; }
  .photo-band img { aspect-ratio: 4 / 3; }
}

/* ───── 하단 사례 CTA ───── */
.cta-cases .cta-mail { color: var(--faint); font-size: 0.95rem; margin: 1.5rem 0 0; }

@media (max-width: 860px) {
  .case-hero-inner { grid-template-columns: 1fr; gap: 2.25rem; }
  .case-hero-media { order: -1; max-width: 420px; }
}

/* ───── 와이드 피처 사진 ───── */
.feature-photo {
  margin: 2.5rem 0 0;
  border-radius: var(--radius);
  overflow: hidden;
  box-shadow: var(--shadow);
}
.feature-photo img {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 7;
  object-fit: cover;
}
.feature-photo figcaption {
  padding: 0.85rem 1.2rem;
  background: var(--card);
  color: var(--muted);
  font-size: 0.9rem;
  font-weight: 600;
}

/* ───── 강의 현장 갤러리 ───── */
.photo-gallery {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(270px, 1fr));
  gap: 1.25rem;
  margin-top: 2.5rem;
}
.photo-gallery figure {
  margin: 0;
  border-radius: var(--radius);
  overflow: hidden;
  border: 1px solid var(--border);
  background: var(--card);
}
.photo-gallery img {
  display: block;
  width: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  transition: transform 0.4s ease;
}
.photo-gallery figure:hover img { transform: scale(1.04); }
.photo-gallery figcaption {
  padding: 0.8rem 1.1rem;
  font-size: 0.88rem;
  color: var(--muted);
  font-weight: 600;
}

/* ───── 인프런 강의 카드 ───── */
.course-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(330px, 1fr));
  gap: 1.5rem;
  margin-top: 2.5rem;
}
.course-card {
  display: flex;
  flex-direction: column;
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  overflow: hidden;
  transition: transform 0.25s ease, box-shadow 0.25s ease;
}
.course-card:hover { transform: translateY(-6px); box-shadow: var(--shadow); }
.course-thumb {
  display: block;
  width: 100%;
  aspect-ratio: 800 / 520;
  object-fit: cover;
  border-bottom: 1px solid var(--border);
}
.course-body { padding: 1.5rem 1.6rem 1.75rem; display: flex; flex-direction: column; flex: 1; }
.course-body h3 { font-size: 1.12rem; margin: 0; }
.course-meta {
  display: flex;
  align-items: center;
  gap: 0.7rem;
  flex-wrap: wrap;
  margin: 0.7rem 0 0.9rem;
  font-size: 0.9rem;
}
.course-rating { font-weight: 800; color: #f5a623; display: inline-flex; align-items: center; gap: 0.25rem; }
.course-rating .num { color: var(--text); }
.course-students { color: var(--muted); }
.course-tag {
  font-size: 0.7rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  color: var(--green);
  border: 1px solid var(--green);
  border-radius: 999px;
  padding: 0.05rem 0.5rem;
}
.course-body .desc { color: var(--muted); font-size: 0.95rem; margin: 0; flex: 1; }
.course-body .card-link { margin-top: 1.1rem; align-self: flex-start; }

/* 수강평 */
.reviews-label {
  margin: 3rem 0 0;
  font-size: 0.82rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--faint);
}
.reviews-label + .card-grid { margin-top: 1.25rem; }
.reviews-grid { grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); }
.quote-card.review { position: relative; padding-top: 2.6rem; }
.quote-card.review::before {
  content: "\201C";
  position: absolute;
  top: 0.6rem;
  left: 1.5rem;
  font-size: 3rem;
  line-height: 1;
  font-weight: 800;
  color: var(--yellow);
}
.quote-card.review p { font-weight: 500; font-size: 0.95rem; line-height: 1.7; color: var(--text); }
.quote-card.review cite { display: block; margin-top: 0.9rem; }
.reviews-more { margin: 1.75rem 0 0; }
.reviews-more a { color: var(--green); font-weight: 700; text-decoration: none; font-size: 0.95rem; }
.reviews-more a:hover { text-decoration: underline; }

/* ───── 강의 이력 ───── */
.lecture-history {
  list-style: none;
  margin: 2.5rem 0 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(360px, 1fr));
  gap: 0 3rem;
}
.lecture-history li {
  display: flex;
  gap: 1.1rem;
  align-items: baseline;
  padding: 1rem 0;
  border-bottom: 1px solid var(--border);
}
.lecture-history .lh-date {
  flex: 0 0 86px;
  font-size: 0.82rem;
  font-weight: 800;
  letter-spacing: 0.01em;
  color: var(--green);
  white-space: nowrap;
}
.lecture-history h3 { font-size: 1rem; margin: 0 0 0.15rem; line-height: 1.4; }
.lecture-history p { color: var(--muted); font-size: 0.9rem; margin: 0; }

/* 강의 이력: 연도별 한 줄 목록 (build_records.py 생성) */
.lecture-history-years { margin-top: 2.5rem; display: grid; gap: 2rem; }
.lh-year { display: grid; grid-template-columns: 5.5rem 1fr; gap: 0 1.5rem; }
.lh-year h3 { font-size: 1.5rem; font-weight: 900; margin: 0; line-height: 1.2; }
.lh-year ul { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--border); }
.lh-year li { display: flex; gap: 1rem; align-items: baseline; padding: 0.55rem 0; border-bottom: 1px solid var(--border); font-size: 0.95rem; line-height: 1.5; }
.lh-year .lh-date { flex: 0 0 7.5rem; font-size: 0.82rem; font-weight: 800; color: var(--green); white-space: nowrap; }
.lh-year .lh-text a { color: inherit; text-decoration: none; }
.lh-year .lh-text a:hover { text-decoration: underline; text-underline-offset: 3px; }
@media (max-width: 640px) {
  .lh-year { grid-template-columns: 1fr; gap: 0.5rem; }
  .lh-year li { flex-direction: column; gap: 0.1rem; }
  .lh-year .lh-date { flex: none; }
}

/* ───── 구독: 운영자 실무 figure ───── */
.run-by {
  display: grid;
  grid-template-columns: 320px 1fr;
  gap: 2.5rem;
  align-items: center;
  margin-top: 2.75rem;
  padding: 1.75rem;
  background: var(--bg-alt);
  border-radius: var(--radius);
}
.run-by img {
  width: 100%;
  border-radius: 14px;
  display: block;
  object-fit: cover;
  aspect-ratio: 16 / 10;
}
.run-by .run-by-label {
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--green);
  margin: 0 0 0.5rem;
}
.run-by h3 { margin: 0 0 0.5rem; font-size: 1.25rem; }
.run-by p { color: var(--muted); margin: 0; font-size: 0.97rem; }
@media (max-width: 720px) {
  .run-by { grid-template-columns: 1fr; gap: 1.5rem; }
  .feature-photo img { aspect-ratio: 16 / 9; }
}

/* ───── 반응형 ───── */
@media (max-width: 720px) {
  .container, .site-header nav { padding-left: 20px; padding-right: 20px; }
  .section { padding: 4.5rem 0; }
  .hero { padding: 5.5rem 0 4.5rem; }
  .site-header ul { gap: 1.1rem; }
  .footer-grid { grid-template-columns: 1fr; gap: 2rem; }
  /* 모바일: 드롭다운 숨김 — 상위 링크가 해당 페이지(하위 섹션 포함)로 이동 */
  .site-header .submenu { display: none; }
  .site-header li.has-sub > a:not(.btn)::after { display: none; }
}

/* ───── 브랜드 이름 마퀴 ───── */
.brand-marquee {
  margin: 2.5rem auto 0;
  max-width: 1080px;
  display: grid;
  gap: 0.9rem;
  /* 양 끝을 흐리게 해 잘린 느낌 대신 계속 흘러가는 느낌을 준다 */
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
  mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
}
.marquee-row { display: flex; width: max-content; }
.marquee-row .marquee-track {
  display: flex;
  gap: 0.9rem;
  list-style: none;
  margin: 0;
  padding: 0 0.9rem 0 0;   /* 두 트랙 이음매도 gap 과 같은 간격이 되게 */
  animation: brand-scroll 46s linear infinite;
}
.marquee-row--reverse .marquee-track { animation-direction: reverse; animation-duration: 54s; }
.brand-marquee:hover .marquee-track { animation-play-state: paused; }
.marquee-row li {
  white-space: nowrap;
  padding: 0.65rem 1.4rem;
  background: var(--card);
  border: 1px solid var(--border);
  border-radius: 999px;
  font-weight: 800;
  font-size: 1rem;
  color: var(--muted);
  box-shadow: var(--shadow);
}
@keyframes brand-scroll {
  from { transform: translateX(0); }
  to   { transform: translateX(-100%); }
}
@media (max-width: 640px) {
  .marquee-row li { font-size: 0.9rem; padding: 0.55rem 1.1rem; }
}
@media (prefers-reduced-motion: reduce) {
  .marquee-row .marquee-track { animation: none; }
  .brand-marquee { -webkit-mask-image: none; mask-image: none; }
  .marquee-row { width: auto; flex-wrap: wrap; justify-content: center; }
  .marquee-row .marquee-track[aria-hidden="true"] { display: none; }
  .marquee-row .marquee-track { flex-wrap: wrap; justify-content: center; }
}

/* 2026 개편 — 공사 현장 공통 규격 */
@font-face {
  font-family:Paperlogy;
  font-weight:800;
  font-display:swap;
  src:url('/assets/fonts/Paperlogy-8ExtraBold.woff2') format('woff2')
}
:root {
  --ink:#0B0B0A;
  --white:#FFFFFF;
  --paper:#F4F4F1;
  --yellow:#FFC71A;
  --green-dark:#4CC764;
  --green-light:#1F7A3A;
  --gray-dark:#9CA19B;
  --gray-light:#6B6F6A;
  --display:'Black Han Sans',Paperlogy,Pretendard,sans-serif;
  --stencil:'Big Shoulders Stencil Display',Impact,sans-serif;
  --body:Pretendard,'Apple SD Gothic Neo',system-ui,sans-serif
}
body {
  font-family:var(--body);
  overflow-wrap:break-word
}
h1,h2 {
  font-family:var(--display);
  font-weight:400;
  text-wrap:balance
}
h1 {
  font-size:clamp(36px,5.2vw,76px);
  line-height:1.17
}
h2 {
  font-size:clamp(28px,3.5vw,48px);
  line-height:1.25
}
a {
  color:inherit
}
button {
  font:inherit
}
button,a,summary {
  -webkit-tap-highlight-color:transparent
}
a:focus-visible,button:focus-visible,summary:focus-visible {
  outline:3px solid var(--green);
  outline-offset:5px
}
.skip-link {
  position:fixed;
  top:8px;
  left:16px;
  z-index:200;
  background:var(--yellow);
  color:var(--ink);
  padding:12px;
  transform:translateY(-160%)
}
.skip-link:focus {
  transform:none
}
.site-header {
  background:var(--ink);
  color:var(--white);
  border-bottom:1px solid #343531;
  backdrop-filter:none;
  z-index:80
}
.site-header nav {
  height:76px;
  max-width:1440px;
  gap:24px
}
.site-header .logo img,.site-footer .footer-logo {
  filter:grayscale(1) brightness(0) invert(1)
}
.site-header ul a:not(.btn) {
  color:var(--white)
}
.site-header ul a[aria-current=page] {
  color:var(--yellow)
}
.site-header ul a:not(.btn):hover {
  color:var(--gray-dark)
}
.site-header .submenu {
  background:var(--ink);
  border-color:#343531;
  border-radius:0
}
.site-header .submenu a:not(.btn) {
  color:var(--white)
}
.site-header .submenu a:not(.btn):hover {
  background:#232421;
  color:var(--white)
}
.menu-toggle {
  display:none;
  background:none;
  border:1px solid #73756f;
  color:white;
  padding:8px 14px;
  cursor:pointer
}
.site-header .btn-primary {
  background:var(--white);
  color:var(--ink)
}
.btn,.btn-cta {
  border-radius:2px;
  position:relative;
  isolation:isolate;
  overflow:hidden
}
.btn-primary {
  color:var(--ink)
}
.btn::after,.btn-cta::after {
  content:'';
  position:absolute;
  inset:0;
  z-index:-1;
  background:repeating-linear-gradient(-45deg,transparent 0 12px,#0b0b0a18 12px 24px);
  transform:translateX(-110%);
  transition:transform .4s
}
.btn:hover::after,.btn-cta:hover::after {
  transform:translateX(0)
}
.site-footer {
  background:var(--ink);
  color:var(--white);
  border-top:1px solid #343531
}
.site-footer p,.site-footer a,.footer-bottom {
  color:var(--gray-dark)
}
.site-footer h4 {
  color:var(--white)
}
.footer-bottom {
  border-color:#343531
}
.stripe {
  height:14px;
  background:repeating-linear-gradient(-45deg,var(--yellow) 0 18px,var(--ink) 18px 36px);
  background-size:51px 51px;
  overflow:hidden
}
.eyebrow,.kicker {
  font-family:var(--stencil);
  color:var(--muted);
  letter-spacing:.14em;
  font-weight:700
}
.eyebrow::before {
  background:currentColor;
  border-radius:0
}
.section-dark,.site-dark {
  --text:var(--white);
  --muted:var(--gray-dark);
  --faint:var(--gray-dark);
  --green:var(--green-dark);
  --border:#353631;
  --card:#151613;
  --bg-alt:#171815;
  background:var(--ink);
  color:var(--white)
}
.section-dark .section-lead,.site-dark .section-lead {
  color:var(--gray-dark)
}
.section-dark .btn-primary,.site-dark .btn-primary {
  color:var(--ink)
}
.section-dark .btn-dark,.site-dark .btn-dark {
  color:var(--ink);
  background:var(--white)
}
.page-head,.site-page .hero,.site-page .case-hero {
  position:relative;
  background:var(--ink);
  color:var(--white);
  text-align:left;
  padding:100px 0 88px;
  border-bottom:14px solid transparent;
  border-image:repeating-linear-gradient(-45deg,var(--yellow) 0 18px,var(--ink) 18px 36px) 14
}
.page-head,.site-page .hero,.site-page .case-hero {
  --text:var(--white);
  --muted:var(--gray-dark);
  --green:var(--green-dark);
  --border:#343531
}
.page-head p,.site-page .hero-sub {
  color:var(--gray-dark)
}
.page-head .eyebrow {
  color:var(--gray-dark)
}
.site-page .hero-sub {
  margin-left:0
}
.site-page .hero-cta {
  justify-content:flex-start
}
.site-page .hero-badge {
  background:transparent;
  color:var(--gray-dark);
  border-radius:0
}
.site-page .center {
  text-align:left
}
.site-page .center .eyebrow {
  justify-content:flex-start
}
.site-page .center .section-lead {
  margin-left:0
}
.site-page .card,.site-page .quote-card,.site-page .pillar,.site-page .course-card,.site-page .run-by,.site-page .photo-gallery figure {
  box-shadow:none;
  border-radius:2px
}
.site-page .card:hover,.site-page .course-card:hover {
  transform:none;
  box-shadow:none;
  border-color:var(--text)
}
.site-page .card-grid {
  gap:1px;
  background:var(--border);
  border:1px solid var(--border)
}
.site-page .card {
  border:0
}
.site-page .quote-card {
  background:var(--card)
}
.site-page .cta-banner {
  background:var(--ink);
  color:var(--white);
  text-align:left;
  border-top:14px solid transparent;
  border-image:repeating-linear-gradient(-45deg,var(--yellow) 0 18px,var(--ink) 18px 36px) 14
}
.site-page .cta-banner p {
  color:var(--gray-dark)
}
.site-page .cta-banner .btn-dark {
  background:var(--yellow);
  color:var(--ink)
}
.site-page .cta-banner .btn-ghost {
  color:var(--white);
  border-color:var(--white)
}
.site-page .icon-chip {
  background:transparent;
  color:var(--text);
  border:1px solid var(--border);
  border-radius:0
}
.site-page .badge {
  background:var(--ink);
  color:var(--white);
  border-radius:0
}
.site-page .course-rating {
  color:var(--green)
}
.site-page .quote-card.review::before {
  color:var(--text)
}
.site-page .stat-num,.site-page .metric-value {
  color:var(--green)
}
.site-page .step-num,.site-page .pillar-num {
  font-family:var(--stencil);
  background:none;
  color:var(--muted);
  border-radius:0
}
.site-page .price-box {
  border-radius:0;
  background:var(--ink);
  color:var(--white)
}
.title-line {
  display:block;
  overflow:clip;
  padding-bottom:.12em;
  margin-bottom:-.12em
}
.title-line>span {
  display:block
}
.lenis.lenis-smooth {
  scroll-behavior:auto!important
}
.lenis.lenis-stopped {
  overflow:hidden
}
.site-page main>* {
  min-width:0
}
.site-page .card-grid,.site-page .course-grid,.site-page .reviews-grid,.site-page .photo-gallery {
  grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr))
}
.site-page .lecture-history {
  grid-template-columns:repeat(auto-fit,minmax(min(100%,360px),1fr))
}
.site-page .table-wrap {
  max-width:100%;
  overflow:auto
}
.site-page .brand-marquee {
  overflow:hidden
}
.site-page .marquee-track {
  animation:none
}
.site-page .marquee-row {
  width:auto;
  flex-wrap:wrap
}
.site-page .marquee-track {
  flex-wrap:wrap
}
.site-page .marquee-track[aria-hidden=true] {
  display:none
}
.site-page .brand-marquee {
  mask-image:none;
  -webkit-mask-image:none
}
.site-page .marquee-row li {
  background:transparent;
  border-radius:0;
  box-shadow:none
}
@media(max-width:760px) {
  .site-header nav {
    height:auto;
    min-height:68px;
    flex-wrap:wrap;
    padding:14px 20px;
    gap:14px
  }
  .site-header .logo img {
    width:155px;
    height:auto
  }
  .site-header nav>ul {
    width:100%;
    flex-wrap:wrap;
    gap:12px 20px;
    padding:6px 0
  }
  .site-header ul a:not(.btn) {
    font-size:14px
  }
  .site-header .submenu {
    display:none
  }
  .menu-ready .menu-toggle {
    display:block
  }
  .menu-ready nav>ul {
    display:none
  }
  .menu-ready.menu-open nav>ul {
    display:flex
  }
  .site-header li.has-sub>a:not(.btn)::after {
    display:none
  }
  .site-page .hero,.site-page .case-hero,.page-head {
    padding:64px 0
  }
  .site-page .section {
    padding:64px 0
  }
  .site-page .stats-row {
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:24px
  }
  .site-page .stat-num {
    font-size:36px
  }
  .site-page .profile-grid {
    grid-template-columns:1fr
  }
  .site-page .profile-photo {
    max-height:480px;
    object-fit:cover
  }
  .site-page .hero-badge {
    max-width:100%;
    font-size:12px
  }
  .site-page .price-box {
    padding:28px 20px
  }
}
@media(prefers-reduced-motion:reduce) {
  html {
    scroll-behavior:auto!important
  }
  *,*::before,*::after {
    animation:none!important;
    transition:none!important
  }
  .title-line {
    overflow:visible
  }
}
/* 홈 — 다리 공사에서 접수까지 */
.home-page {
  background:var(--ink)
}
.home-page .site-header {
  position:absolute;
  inset:0 0 auto;
  background:transparent;
  border:0
}
.home-page .site-header nav {
  max-width:none;
  padding-inline:36px
}
.home-page .site-header .submenu {
  background:var(--ink)
}
.home-section {
  padding:100px 0
}
.home-section h2 {
  font-size:clamp(36px,5vw,68px);
  line-height:1.17;
  margin:16px 0 28px
}
.home-section .kicker {
  font-size:14px;
  margin:0;
  color:var(--muted)
}
.home-lead {
  color:var(--muted);
  font-size:18px;
  max-width:560px;
  margin:0 0 36px
}
.text-link {
  display:inline-block;
  text-decoration:none;
  border-bottom:1px solid currentColor;
  padding:8px 0;
  font-weight:700
}
.text-link:hover {
  opacity:.7
}
.bridge-scene {
  height:100svh;
  position:relative;
  background:#0e1a24;
  color:white
}
.bridge-scene.is-scrubbed {
  height:430svh
}
.bridge-stage {
  position:sticky;
  top:0;
  height:100svh;
  overflow:hidden
}
.bridge-images,.bridge-layer,.bridge-layer img {
  position:absolute;
  inset:0;
  width:100%;
  height:100%
}
.bridge-layer img {
  object-fit:cover
}
.bridge-layer:not(:first-child) {
  opacity:0
}
.bridge-layer:first-child {
  opacity:1
}
/* 프레임 시퀀스 캔버스. 첫 프레임을 그린 뒤에만 보이고, 그 전과 실패 시에는 단계 이미지가 보인다. */
.bridge-canvas {
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  display:block;
  opacity:0
}
.bridge-scene.has-frames .bridge-canvas {
  opacity:1
}
.bridge-scene.has-frames .bridge-layer {
  visibility:hidden
}
.bridge-copy {
  position:absolute;
  left:clamp(20px,4vw,64px);
  top:120px;
  max-width:760px;
  text-shadow:0 2px 16px #07101b
}
.bridge-copy h1 {
  font-size:clamp(34px,4.7vw,68px);
  line-height:1.17;
  margin:12px 0 20px
}
.bridge-copy p {
  font-size:16px;
  margin:0
}
.bridge-copy .kicker {
  font-size:14px;
  color:white
}
.bridge-log {
  position:absolute;
  right:clamp(20px,4vw,64px);
  bottom:92px;
  text-align:right;
  font-family:var(--stencil);
  letter-spacing:.1em;
  text-shadow:0 2px 8px #000
}
.bridge-log>span {
  font-size:12px
}
.number-window {
  height:88px;
  overflow:hidden;
  margin:8px 0
}
.number-reel b {
  display:block;
  font-size:88px;
  line-height:88px;
  font-weight:900
}
.bridge-foot {
  position:absolute;
  left:clamp(20px,4vw,64px);
  right:clamp(20px,4vw,64px);
  bottom:36px;
  display:flex;
  justify-content:space-between;
  font-size:12px;
  letter-spacing:.05em;
  text-shadow:0 1px 5px #000
}
.bridge-progress {
  position:absolute;
  inset:auto 0 0;
  height:3px;
  background:#ffffff30
}
.bridge-progress i {
  display:block;
  width:100%;
  height:100%;
  background:var(--yellow);
  transform:scaleX(0);
  transform-origin:left
}
.bridge-flash,.bridge-black {
  position:absolute;
  inset:0;
  pointer-events:none;
  opacity:0
}
.bridge-flash {
  background:white
}
.bridge-black {
  background:var(--ink)
}
.storefront {
  padding:100px 32px 0;
  overflow:hidden
}
.store-scene {
  max-width:1096px;
  margin:auto;
  border:1px solid #404139;
  background:#181a16;
  box-shadow:0 0 60px #000
}
.store-fascia {
  display:flex;
  justify-content:space-between;
  gap:16px;
  padding:20px 28px;
  border-bottom:1px solid #45483f;
  font-family:var(--stencil);
  font-size:20px;
  letter-spacing:.1em
}
.store-fascia span:last-child {
  font-family:var(--body);
  font-size:13px;
  color:var(--gray-dark)
}
.store-led {
  margin:24px;
  border:9px solid #2f302b;
  outline:1px solid #4e5047;
  background:#030403;
  padding:30px 16px;
  text-align:center;
  box-shadow:inset 0 0 20px #000,0 0 30px #ffc71a12;
  min-height:128px;
  display:grid;
  place-items:center
}
.store-led span {
  font-family:var(--display);
  font-size:clamp(24px,4.5vw,60px);
  line-height:1.4;
  color:#ffe7a3;
  text-shadow:0 0 12px #ffc71a70;
  mask:radial-gradient(circle,#000 58%,transparent 62%) 0 0/4px 4px
}
.store-shutter {
  min-height:200px;
  padding:28px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  background:repeating-linear-gradient(0deg,#1b1d19 0 12px,#292b25 12px 13px,#10110f 13px 15px);
  color:var(--gray-dark);
  font-size:14px
}
.store-open {
  font-family:var(--stencil);
  font-size:54px;
  letter-spacing:.08em;
  transform:rotate(-7deg);
  border:1px solid #6b6f6a;
  padding:0 22px;
  color:white;
  background:var(--ink)
}
.concern-orders {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:14px
}
.concern-order {
  display:flex;
  flex-direction:column;
  gap:24px;
  text-align:left;
  padding:26px;
  background:#151613;
  color:var(--white);
  border:1px solid #3d3e38;
  cursor:pointer;
  min-width:0
}
.concern-order>span {
  font-size:12px;
  letter-spacing:.08em;
  color:var(--gray-dark)
}
.concern-order strong {
  font-size:clamp(20px,2.1vw,27px);
  line-height:1.45
}
.concern-order small {
  color:var(--gray-dark)
}
.concern-order[aria-expanded=true] {
  border-color:#a0a397
}
.concern-order:hover {
  background:#23251f
}
.concern-panels {
  margin-top:20px
}
.concern-panel {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:40px;
  padding:32px 0;
  border-top:1px solid #56594d
}
.concern-panel[hidden] {
  display:none
}
.concern-panel h3 {
  font-size:24px
}
.concern-panel p {
  color:var(--gray-dark)
}
.concern-panel .panel-price {
  color:var(--white);
  font-size:24px;
  font-weight:800;
  margin-top:0
}
.panel-price small {
  font-size:13px;
  font-weight:400
}
.panel-actions {
  display:flex;
  gap:18px;
  align-items:center;
  flex-wrap:wrap
}
.hoarding {
  overflow:hidden;
  background:var(--ink);
  color:white
}
.hoarding-wall {
  padding:96px 0 72px;
  background:repeating-linear-gradient(90deg,#11120f 0 9px,#191b15 9px 11px,#090a08 11px 14px);
  position:relative
}
.hoarding-marquee {
  font-family:var(--stencil);
  font-size:clamp(80px,12vw,180px);
  line-height:1;
  white-space:nowrap;
  color:#75796a;
  opacity:.28;
  margin-bottom:48px;
  will-change:transform
}
.hoarding h2 {
  font-size:clamp(38px,5vw,68px);
  margin:14px 0 40px
}
.hoarding .kicker {
  color:var(--gray-dark)
}
.service-register a {
  display:grid;
  grid-template-columns:45px 1fr 1.2fr 32px;
  gap:20px;
  align-items:center;
  text-decoration:none;
  border-top:1px solid #4a4e41;
  padding:30px 0
}
.service-register a:last-child {
  border-bottom:1px solid #4a4e41
}
.service-register a>span {
  font-family:var(--stencil);
  color:var(--gray-dark)
}
.service-register h3 {
  font-size:26px;
  margin:0
}
.service-register p {
  color:var(--gray-dark);
  font-size:15px;
  margin:0
}
.service-register b {
  font-size:26px
}
.service-register a:hover h3 {
  text-decoration:underline
}
.home-cases {
  background:white;
  color:var(--ink);
  --muted:var(--gray-light)
}
.highlight {
  background:linear-gradient(transparent 67%,var(--yellow) 67% 91%,transparent 91%)
}
.case-ledger {
  border-top:2px solid var(--ink);
  margin:30px 0 24px
}
.case-row {
  display:grid;
  grid-template-columns:1fr auto;
  gap:30px;
  border-bottom:1px solid #d4d6cf;
  padding:23px 0;
  align-items:center
}
.case-row h3 {
  font-size:22px;
  margin:3px 0
}
.case-row>div>span,.case-row>div>p {
  font-size:13px;
  color:var(--gray-light);
  margin:0
}
.case-result {
  margin:0;
  color:var(--green-light);
  white-space:nowrap;
  font-family:var(--stencil);
  line-height:1
}
.case-result small {
  display:block;
  font-family:var(--body);
  font-size:12px;
  line-height:1.5;
  color:var(--gray-light);
  margin-bottom:5px
}
.case-result b {
  font-size:62px;
  font-weight:900;
  font-variant-numeric:tabular-nums
}
.case-result em {
  font-family:var(--body);
  font-style:normal;
  font-weight:700;
  font-size:30px
}
.blueprint {
  background:var(--paper);
  color:var(--ink);
  background-image:linear-gradient(#ddd 1px,transparent 1px),linear-gradient(90deg,#ddd 1px,transparent 1px);
  background-size:32px 32px
}
.blueprint-svg {
  width:100%;
  height:auto;
  margin-top:48px
}
.blueprint-notes {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  list-style:none;
  gap:20px;
  padding:0;
  margin:20px 0 0
}
.blueprint-notes li {
  font-size:14px;
  color:var(--gray-light)
}
.blueprint-notes b {
  display:block;
  color:var(--ink);
  font-size:22px
}
.home-review-grid {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:48px;
  margin:44px 0
}
.home-reviews .quote-card {
  margin:0;
  padding:24px 0;
  border:0;
  border-top:1px solid #55584d;
  background:none;
  box-shadow:none;
  border-radius:0
}
.home-reviews .quote-card p {
  font-size:18px;
  color:white
}
.home-reviews .quote-card cite {
  color:var(--gray-dark);
  font-size:13px
}
.home-reviews .quote-card::before {
  display:none
}
.home-team {
  background:white;
  color:var(--ink)
}
.team-layout {
  display:grid;
  grid-template-columns:1fr 440px;
  gap:60px;
  align-items:center
}
.crew-badge {
  background:var(--paper);
  border:1px solid #b9bcb1;
  padding:18px 22px 24px;
  position:relative;
  box-shadow:8px 10px 0 #0b0b0a0d
}
.badge-slot {
  width:80px;
  height:9px;
  background:white;
  border:1px solid #b9bcb1;
  border-radius:10px;
  margin:0 auto 20px
}
.crew-badge img {
  width:100%;
  height:280px;
  object-fit:cover;
  object-position:50% 30%;
}
.crew-badge>div:last-child {
  padding-top:22px
}
.crew-badge span {
  font-size:12px;
  letter-spacing:.1em;
  color:var(--gray-light)
}
.crew-badge h3 {
  font-size:32px;
  margin:8px 0
}
.crew-badge p {
  color:var(--gray-light);
  margin:0
}
.field-log {
  background:var(--paper);
  color:var(--ink)
}
.journal-links {
  margin-top:44px;
  border-top:2px solid var(--ink)
}
.journal-links a {
  display:grid;
  grid-template-columns:1fr 1fr 30px;
  align-items:center;
  gap:20px;
  padding:28px 0;
  border-bottom:1px solid #cccfc4;
  text-decoration:none
}
.journal-links span {
  font-size:13px;
  color:var(--gray-light)
}
.journal-links strong {
  font-size:24px
}
.journal-links b {
  font-size:26px
}
.home-final h2 {
  font-size:clamp(38px,5.5vw,76px)
}
.final-actions {
  display:flex;
  flex-wrap:wrap;
  gap:16px;
  margin-top:40px
}
.home-faq {
  margin-top:80px;
  border-top:1px solid #3a3c34;
  padding-top:28px;
  max-width:800px
}
.home-faq details {
  border-bottom:1px solid #3a3c34;
  padding:18px 0
}
.home-faq summary {
  cursor:pointer
}
.home-faq p {
  color:var(--gray-dark);
  font-size:15px
}
@media(max-width:760px) {
  .home-page .site-header nav {
    padding:14px 20px
  }
  .home-page .site-header.menu-open {
    background:var(--ink)
  }
  .bridge-scene.is-scrubbed {
    height:310svh
  }
  .bridge-copy {
    top:108px;
    max-width:calc(100% - 40px)
  }
  .bridge-copy h1 {
    font-size:clamp(30px,8.5vw,44px)
  }
  .bridge-copy>p:last-child {
    font-size:13px
  }
  .bridge-copy .kicker {
    font-size:11px
  }
  .bridge-foot>span:last-child {
    display:none
  }
  .bridge-log {
    bottom:82px
  }
  .number-window {
    height:60px
  }
  .number-reel b {
    font-size:60px;
    line-height:60px
  }
  .bridge-log>span {
    font-size:10px
  }
  .home-section {
    padding:68px 0
  }
  .home-section h2 {
    font-size:38px
  }
  .home-lead {
    font-size:16px
  }
  .storefront {
    padding:60px 20px 0
  }
  .store-fascia {
    padding:16px 12px;
    font-size:17px
  }
  .store-fascia span:last-child {
    font-size:10px
  }
  .store-led {
    margin:14px;
    border-width:6px;
    padding:20px 8px;
    min-height:100px
  }
  .store-led span {
    font-size:clamp(18px,5.4vw,32px);
    mask-size:3px 3px
  }
  .store-shutter {
    min-height:160px;
    padding:20px;
    font-size:12px
  }
  .store-open {
    font-size:32px;
    padding:0 12px
  }
  .concern-orders {
    grid-template-columns:1fr;
    gap:10px
  }
  .concern-order {
    padding:20px;
    gap:12px;
    position:relative
  }
  .concern-order strong {
    font-size:21px
  }
  .concern-order strong br {
    display:none
  }
  .concern-order small {
    font-size:12px
  }
  .concern-panel {
    grid-template-columns:1fr;
    gap:22px;
    padding:24px 0
  }
  .concern-panel h3 {
    font-size:22px
  }
  .concern-panel p {
    font-size:15px
  }
  .concern-panel .panel-price {
    font-size:24px
  }
  .hoarding-wall {
    padding:50px 0
  }
  .hoarding-marquee {
    font-size:90px;
    margin-bottom:36px
  }
  .service-register a {
    grid-template-columns:28px 1fr 26px;
    gap:12px;
    padding:24px 0
  }
  .service-register h3 {
    font-size:22px
  }
  .service-register p {
    grid-column:2;
    grid-row:2;
    font-size:14px
  }
  .service-register b {
    grid-column:3;
    grid-row:1
  }
  .case-row {
    gap:12px;
    padding:17px 0
  }
  .case-row h3 {
    font-size:17px
  }
  .case-row>div>p {
    font-size:12px
  }
  .case-result b {
    font-size:42px
  }
  .case-result em {
    font-size:22px
  }
  .case-result small {
    font-size:10px
  }
  .case-row>div>span {
    font-size:10px
  }
  .home-cases h2 {
    font-size:34px
  }
  .home-cases .home-lead {
    margin-bottom:20px
  }
  .home-cases .case-ledger {
    margin:20px 0
  }
  .blueprint-svg {
    margin-top:24px
  }
  .blueprint-notes {
    grid-template-columns:1fr;
    gap:0
  }
  .blueprint-notes li {
    display:flex;
    align-items:center;
    gap:24px;
    padding:18px 0;
    border-top:1px solid #c6c9bd
  }
  .blueprint-notes b {
    min-width:70px;
    font-size:24px
  }
  .home-review-grid {
    grid-template-columns:1fr;
    gap:18px;
    margin:28px 0
  }
  .home-reviews .quote-card p {
    font-size:17px
  }
  .team-layout {
    grid-template-columns:1fr;
    gap:40px
  }
  .crew-badge {
    max-width:400px;
    width:100%;
    margin:0 auto
  }
  .crew-badge img {
    height:260px
  }
  .journal-links a {
    grid-template-columns:1fr 30px;
    gap:8px;
    padding:24px 0
  }
  .journal-links span {
    grid-column:1
  }
  .journal-links strong {
    grid-column:1;
    font-size:23px
  }
  .journal-links b {
    grid-column:2;
    grid-row:span 2
  }
  .final-actions {
    flex-direction:column;
    align-items:flex-start
  }
  .home-faq {
    margin-top:56px
  }
}
@media(prefers-reduced-motion:reduce) {
  .bridge-scene.is-scrubbed {
    height:100svh
  }
  .bridge-log .number-reel {
    transform:translateY(-75%)
  }
  .bridge-progress i {
    transform:scaleX(1)
  }
  .bridge-flash,.bridge-black {
    display:none
  }
}
/* 서브 페이지별 작업 명세 */
.blueprint-surface {
  background-color:var(--paper);
  background-image:linear-gradient(#e1e3dc 1px,transparent 1px),linear-gradient(90deg,#e1e3dc 1px,transparent 1px);
  background-size:32px 32px
}
.site-page .stat .stat-num,.site-page .stat .stat-num em,.site-page .case-metric .metric-num {
  color:var(--green)
}
.site-page .pain-card h3::before {
  color:var(--text)
}
.site-page .card .skill-list li::before {
  background:var(--text)
}
.site-page .card-label,.site-page .profile-title,.site-page .case-cat {
  color:var(--muted)
}
.site-page .section-dark .eyebrow {
  color:var(--gray-dark);
  justify-content:flex-start
}
.site-page .statement {
  text-align:left
}
.site-page .statement .big {
  margin-left:0;
  font-family:var(--display)
}
.site-page .mission {
  text-align:left
}
.site-page .mission blockquote {
  margin-left:0
}
.site-page .price-card {
  border-radius:0;
  text-align:left
}
.site-page .price-card ul li::before {
  color:var(--gray-dark)
}
.site-page .price-card .btn-primary {
  color:var(--ink)
}
.site-page .timeline li::before {
  background:var(--ink);
  border-radius:0
}
.site-page .table-wrap {
  border-top:2px solid var(--text)
}
.site-page .compare-table td {
  white-space:normal
}
.site-page .compare-table {
  margin:0;
  min-width:560px
}
.page-subscription .case-grid {
  display:block
}
.page-subscription .case-card {
  display:grid;
  grid-template-columns:1fr .8fr 1.4fr;
  align-items:center;
  gap:30px;
  border:0;
  border-top:1px solid #b9bdb1;
  border-radius:0;
  padding:32px 0;
  box-shadow:none;
  background:transparent
}
.page-subscription .case-card::before {
  display:none
}
.page-subscription .case-card:hover {
  transform:none
}
.page-subscription .case-metric {
  margin:0;
  padding:0;
  border:0
}
.page-subscription .case-cat {
  margin-bottom:8px
}
.page-subscription .case-hero-media img {
  border-radius:0;
}
.page-subscription .photo-band {
  max-width:100%;
  padding:0;
  margin:0
}
.page-subscription .photo-band img {
  border-radius:0;
  max-height:400px;
}
.page-subscription .run-by {
  border-left:4px solid var(--ink)
}
.page-education .course-card {
  border:1px solid var(--border)
}
.page-education .course-body {
  padding:28px
}
.page-education .lecture-history {
  border-top:2px solid var(--ink)
}
.page-education .lh-date {
  font-family:var(--stencil);
  font-size:16px;
  color:var(--muted)
}
.page-education .feature-photo {
  border-radius:0
}
.page-education .quote-card {
  border:0;
  border-top:1px solid var(--border)
}
.page-oneday .hero {
  background:repeating-linear-gradient(90deg,#0b0b0a 0 12px,#161713 12px 14px)
}
.page-oneday .steps {
  gap:24px
}
.page-oneday .steps li {
  border-top:2px solid var(--text);
  padding-top:24px
}
.page-oneday .curriculum details {
  border-radius:0
}
.page-oneday .price-card {
  max-width:760px;
  margin-left:0
}
.page-oneday .feature-photo {
  border-radius:0
}
.page-about .profile-photo {
  border-radius:0;
  border:14px solid var(--paper);
  box-shadow:8px 8px 0 #ddd
}
.page-about .timeline {
  border-top:2px solid var(--ink);
  padding-top:30px
}
.page-about .profile-grid {
  align-items:start
}
.page-about .profile-name {
  font-family:var(--display);
  font-size:40px
}
.page-contents .page-head {
  background:repeating-linear-gradient(90deg,#0b0b0a 0 12px,#161713 12px 14px)
}
.page-contents main>.section {
  border-bottom:1px solid var(--border)
}
.page-contents .quote-card {
  border:0;
  border-top:1px solid var(--border);
  padding-left:0;
  background:transparent
}
.page-contents .reviews-grid {
  background:transparent;
  border:0;
  gap:36px
}
@media(max-width:760px) {
  .page-subscription .case-card {
    grid-template-columns:1fr auto;
    gap:16px;
    padding:24px 0
  }
  .page-subscription .case-desc {
    grid-column:1/-1
  }
  .page-subscription .case-head h3 {
    font-size:19px
  }
  .page-subscription .case-metric .metric-num {
    font-size:34px
  }
  .page-subscription .case-hero-media {
    max-width:none
  }
  .page-oneday .steps {
    grid-template-columns:1fr
  }
  .site-page .price-card {
    padding:28px 22px
  }
  .site-page .price-card .price {
    font-size:40px
  }
  .site-page .run-by {
    padding:24px
  }
  .site-page .compare-table {
    font-size:13px
  }
}
/* 광고 랜딩 — 기존 콘텐츠/CTA 전용 스타일, 공통 선택자와 분리 */
.course-landing {
  --text:var(--white);
  --muted:var(--gray-dark);
  --faint:var(--gray-dark);
  --green:var(--green-dark);
  --bg:var(--ink);
  --bg-soft:#161713;
  --bg-soft2:#20221c;
  --line:#3c4035;
  --border:#3c4035;
  --card:#161713;
  --radius:2px;
  background:var(--ink);
  color:white;
  text-align:left;
  line-height:1.7;
  padding-bottom:90px
}
.course-landing .wrap {
  max-width:1040px;
  padding-inline:32px
}
.course-landing .narrow {
  max-width:800px
}
.course-landing a {
  text-decoration:none
}
.course-landing header {
  padding:26px 0 10px
}
.course-landing .subnav {
  justify-content:flex-start;
  padding:14px 0;
  gap:24px
}
.course-landing header .logo img {
  height:28px;
  width:auto
}
.course-landing .promo-bar {
  background:var(--ink);
  color:var(--white);
  border-bottom:1px solid #515548;
  position:relative;
  text-align:center;
  font-size:13px;
  padding:12px 20px
}
.course-landing .promo-bar b {
  color:white
}
.course-landing .hero {
  background:repeating-linear-gradient(90deg,#0b0b0a 0 12px,#161713 12px 14px);
  padding:70px 0 56px;
  text-align:left;
  border-bottom:14px solid transparent;
  border-image:repeating-linear-gradient(-45deg,var(--yellow) 0 18px,var(--ink) 18px 36px) 14
}
.course-landing .hero-overlay {
  display:none
}
.course-landing .hero h1 {
  font-family:var(--display);
  font-size:clamp(34px,5vw,62px);
  font-weight:400;
  line-height:1.22;
  text-shadow:none
}
.course-landing #type-h1 {
  min-height:0
}
.course-landing .caret {
  display:none
}
.course-landing .hero .pills,.course-landing .hero .tools {
  justify-content:flex-start
}
.course-landing .hero .pill {
  border-radius:0;
  background:transparent!important;
  color:var(--gray-dark)!important;
  border:1px solid #55584b!important
}
.course-landing .hero .tools b {
  background:none;
  border-radius:0;
  color:var(--gray-dark)
}
.course-landing .eyebrow {
  color:var(--muted);
  justify-content:flex-start
}
.course-landing .eyebrow::before {
  display:none
}
.course-landing .hero .eyebrow {
  color:var(--gray-dark);
  text-shadow:none
}
.course-landing .hero-card-sec {
  padding:54px 0
}
.course-landing .course-card {
  max-width:none;
  border-radius:0;
  display:grid;
  grid-template-columns:1fr 1fr;
  box-shadow:none;
  background:var(--paper);
  color:var(--ink);
  border:0
}
.course-landing .course-card:hover {
  transform:none;
  box-shadow:none
}
.course-landing .course-card .thumb-wrap {
  display:flex;
  align-items:center;
  background:#e5e6df
}
.course-landing .course-card .thumb-wrap img {
  width:100%;
  height:auto;
  border-radius:0
}
.course-landing .card-body {
  padding:32px
}
.course-landing .card-body h2 {
  font-family:Paperlogy,var(--body);
  font-size:24px;
  font-weight:800;
  line-height:1.4
}
.course-landing .course-card .lbl,.course-landing .course-card .micro,.course-landing .course-card .orig {
  color:var(--gray-light)
}
.course-landing .course-card .big,.course-landing .course-card .star {
  color:var(--green-light)
}
.course-landing .course-card .price {
  justify-content:flex-start;
  flex-wrap:wrap
}
.course-landing .course-card .pct {
  color:var(--ink)
}
.course-landing .course-card .now {
  color:var(--ink)
}
.course-landing .disc-badge {
  background:var(--ink);
  color:white;
  border-radius:0
}
.course-landing .card-cta {
  border-radius:0;
  background:var(--yellow);
  color:var(--ink)
}
.course-landing .stats {
  justify-content:flex-start
}
.course-landing .stat {
  background:none
}
.course-landing main>section {
  border-bottom:1px solid var(--line)
}
.course-landing .sec {
  padding:64px 0
}
.course-landing .sec h3 {
  font-family:var(--display);
  font-weight:400;
  font-size:clamp(28px,3.8vw,44px);
  line-height:1.3;
  text-align:left
}
.course-landing .sec .sub {
  color:var(--muted)
}
.course-landing .band {
  padding:56px 0;
  background:var(--paper);
  color:var(--ink);
  --muted:var(--gray-light)
}
.course-landing .band-img {
  border-radius:0
}
.course-landing .band-cap {
  color:var(--gray-light)
}
.course-landing .outputs {
  gap:1px
}
.course-landing .outputs>*,.course-landing .out,.course-landing .review,.course-landing details,.course-landing .gallery-item {
  border-radius:0;
  box-shadow:none
}
.course-landing .btn-cta {
  animation:none;
  border-radius:0;
  margin-left:0;
  max-width:440px
}
.course-landing .btn-ghost {
  border-radius:0;
  color:var(--white);
  border-color:var(--white)
}
.course-landing .coupon {
  border-radius:0;
  text-align:left;
  background:#171914;
  border:1px solid #55594d
}
.course-landing .coupon .price {
  justify-content:flex-start
}
.course-landing .coupon .btn-cta {
  margin-left:0
}
.course-landing .instructor {
  border-radius:0
}
.course-landing .instructor img {
  border-radius:0
}
.course-landing .metrics {
  gap:16px
}
.course-landing .metric strong,.course-landing .metric b {
  color:var(--green-dark)
}
.course-landing .reviews {
  text-align:left
}
.course-landing .review .stars {
  color:var(--white)
}
.course-landing .final {
  text-align:left;
  padding:68px 0
}
.course-landing .final h3 {
  font-family:var(--display);
  font-weight:400;
  font-size:clamp(34px,5vw,60px)
}
.course-landing .final p {
  color:var(--gray-dark)
}
.course-landing .sticky {
  background:var(--ink);
  border-top:1px solid #585c4f
}
.course-landing .sticky .go {
  border-radius:0;
  background:var(--yellow);
  color:var(--ink)
}
.course-landing footer {
  padding:36px 0
}
.course-landing footer .social {
  display:flex;
  flex-wrap:wrap;
  gap:16px
}
.course-landing .micro {
  font-size:13px
}
.course-landing .price {
  color:inherit
}
.course-landing .table-wrap {
  overflow:auto;
  max-width:100%
}
.course-landing .compare {
  min-width:500px
}
@media(max-width:760px) {
  .course-landing .wrap {
    padding-inline:20px
  }
  .course-landing .hero {
    padding:40px 0
  }
  .course-landing .course-card {
    grid-template-columns:1fr
  }
  .course-landing .card-body {
    padding:24px
  }
  .course-landing .subnav {
    gap:18px;
    font-size:13px
  }
  .course-landing .sec {
    padding:48px 0
  }
  .course-landing .hero .tools {
    gap:6px
  }
  .course-landing .hero .tools b {
    font-size:11px
  }
  .course-landing .sticky .inner {
    padding:12px 16px;
    gap:12px
  }
  .course-landing .sticky .meta {
    gap:5px;
    font-size:10px
  }
  .course-landing .sticky .go {
    font-size:14px;
    padding:12px 14px;
    white-space:nowrap
  }
  .course-landing .course-card h2 {
    font-size:23px
  }
  .course-landing .btn-cta {
    font-size:16px;
    padding:16px
  }
  .course-landing .gallery {
    grid-template-columns:1fr 1fr
  }
  .course-landing .metric {
    min-width:0
  }
}
/* 점검 수정: 밝은 바탕 대비, 작은 화면의 최소 너비, 랜딩 전용 컴포넌트 */
.site-page .card-link,.site-page .step-num,.site-page .pillar-num {
  color:var(--text)
}
.site-page .stat,.site-page .profile-grid>*,.case-row>*,.course-landing .course-card>*,.course-landing .wrap>* {
  min-width:0
}
.course-landing .band {
  --text:var(--ink);
  --faint:var(--gray-light);
  --green:var(--green-light);
  --line:#c9ccbf;
  --bg-soft:var(--white)
}
.course-landing .sec .eyebrow,.course-landing .sec .sub {
  text-align:left;
  color:var(--muted)
}
.course-landing .gallery figure,.course-landing .pipe .node,.course-landing .builds .b,.course-landing .curri .grp,.course-landing .persona li,.course-landing .author,.course-landing .author-metrics .m,.course-landing .bundle,.course-landing .compare,.course-landing .final {
  border-radius:0
}
.course-landing .pipe .arrow {
  color:var(--text)
}
.course-landing .pipe .node .h .n,.course-landing .curri .grp .h .n {
  color:var(--muted);
  border-color:var(--line);
  border-radius:0
}
.course-landing .author-metrics .m b {
  color:var(--green-dark)
}
.course-landing .author img {
  border-radius:0;
  border-color:var(--gray-dark)
}
.course-landing .persona li {
  display:block
}
.course-landing .persona li::before {
  margin-right:8px
}
.course-landing .persona b,.course-landing .bundle .total,.course-landing .review .rs,.course-landing .reviews-more a {
  color:var(--white)
}
.course-landing .pricebox {
  background:var(--bg-soft);
  border-color:var(--line);
  border-radius:0
}
.course-landing .pricebox .tag {
  color:var(--gray-dark)
}
.course-landing .pricebox .note b {
  color:var(--white)
}
.course-landing .final {
  background:var(--ink);
  border:0
}
.course-landing .compare {
  min-width:0
}
.course-landing .compare .crow {
  grid-template-columns:minmax(0,1.4fr) minmax(0,1fr) minmax(0,1fr)
}
.course-landing .compare .head .ours {
  color:var(--ink);
  background:var(--paper)
}
.course-landing .compare .ours {
  background:var(--paper)
}
.course-landing .gallery .live {
  color:white;
  background:var(--ink);
  border-radius:0
}
.course-landing .course-card .star {
  color:var(--green-light)
}
.course-landing .social {
  justify-content:flex-start
}
@media(max-width:760px) {
  .course-landing .compare .c {
    padding:12px 7px;
    font-size:12px;
    overflow-wrap:anywhere
  }
  .course-landing .hero h1 {
    font-size:32px
  }
  .course-landing .course-card .price {
    gap:8px
  }
  .course-landing .pricebox .big s {
    display:block;
    margin-left:0
  }
  .home-cases .container {
    padding-inline:20px
  }
}
@media(max-width:980px) {
  .site-header nav {
    height:auto;
    min-height:68px;
    flex-wrap:wrap;
    padding:14px 20px;
    gap:14px
  }
  .site-header .logo img {
    width:155px;
    height:auto
  }
  .site-header nav>ul {
    width:100%;
    flex-wrap:wrap;
    gap:12px 20px;
    padding:6px 0
  }
  .menu-ready .menu-toggle {
    display:block
  }
  .menu-ready nav>ul {
    display:none
  }
  .menu-ready.menu-open nav>ul {
    display:flex
  }
  .site-header .submenu {
    display:none
  }
  .site-header li.has-sub>a:not(.btn)::after {
    display:none
  }
  .home-page .site-header:not(.menu-ready) {
    position:relative;
    background:var(--ink)
  }
}

/* 12장 컬러풀 리디자인 — 기존 히어로 캔버스 스타일은 유지 */
:root { --deep-yellow:#EBAE00; --brand-green:#3FB23F; --lime:#C6F23C; --offwhite:#F7F7F5; }
.home-page { --page-bg:#111111; background:var(--page-bg); }
.home-page main { overflow:clip; }
.sticker { display:block; width:100%; height:auto; object-fit:contain; }
.intro-loader[hidden] { display:none; }
.intro-loader { position:fixed; inset:0; z-index:10000; pointer-events:none; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:20px; background:#FFC71A; color:#111; }
.intro-loader::before,.intro-loader::after { content:""; position:absolute; left:0; right:0; height:12vh; background:repeating-linear-gradient(-45deg,#111 0 28px,#FFC71A 28px 56px); }
.intro-loader::before { top:0; } .intro-loader::after { bottom:0; }
.intro-loader strong { font:900 clamp(52px,11vw,150px)/.88 var(--body); letter-spacing:-.08em; }
.intro-progress { font:900 44px/1 var(--body); font-variant-numeric:tabular-nums; }
.intro-caption { font-size:12px; letter-spacing:.25em; }
.color-welcome { position:relative; background:#111; color:#111; isolation:isolate; }
.takeover-curtain { position:absolute; inset:0; background:#FFC71A; z-index:-1; }
.welcome-stage { position:relative; height:90svh; min-height:600px; display:grid; place-items:center; }
.bridge-manifesto { position:absolute; inset:14% -8% auto; font:900 clamp(88px,14vw,240px)/.98 var(--body); letter-spacing:-.065em; color:var(--deep-yellow); white-space:nowrap; }
.bridge-manifesto span { display:block; } .bridge-manifesto span+span { margin-left:6%; }
.welcome-mascot { width:clamp(180px,22vw,340px); position:relative; z-index:1; }
.welcome-robot { position:absolute; right:9%; top:14%; width:clamp(75px,10vw,145px); }
.welcome-robot::before { content:"✦"; position:absolute; right:-15%; top:-15%; color:var(--lime); font-size:60px; }
.welcome-note { position:absolute; bottom:7%; left:8%; font-weight:700; font-size:clamp(18px,2vw,26px); }
.pill-stage { text-align:center; padding:70px 0; }
.pill-heading { font:900 clamp(46px,7vw,104px)/1.2 var(--body); letter-spacing:-.06em; margin:0 0 25px; }
.sprout-pill { display:inline-flex; overflow:visible; width:1.8em; height:.95em; border-radius:2em; background:white; vertical-align:middle; align-items:center; justify-content:center; position:relative; }
.pill-sprout { width:.72em; max-width:none; height:1.08em; }
.pill-stage h2 { font:800 clamp(24px,3.8vw,52px)/1.2 var(--body); }
.pill-led { min-height:1.5em; font-size:14px; letter-spacing:.08em; margin:18px 0 0; }
.concern-section { background:#FFC71A; color:#111; --muted:#45401e; padding-top:40px; }
.concern-section .concern-title { font:900 clamp(38px,5.2vw,76px)/1.1 var(--body); }
.concern-order { background:white; color:#111; border:2px solid transparent; border-radius:22px; box-shadow:0 8px 0 #d99f00; }
.concern-order>span,.concern-order small { color:#555; }
.concern-order:hover,.concern-order[aria-expanded=true] { background:#fff; border-color:#111; }
.concern-order[aria-expanded=true] small { color:#1F7A3A; font-weight:800; }
.concern-panel { border-color:#ad8209; gap:40px; }
.concern-panel p,.concern-panel .panel-price { color:#111; }
.concern-section .btn-primary,.home-final .btn-primary { background:#111; color:white; }
.build-services { padding:80px 0 60px; background:var(--offwhite); color:#111; }
.build-services h2 { font:800 clamp(24px,3vw,44px)/1.3 var(--body); margin:24px 0 0; }
.service-label { display:inline-block; background:#FFC71A; padding:8px 18px; border-radius:100px; font-size:14px; font-weight:800; }
.giant-display { font:900 clamp(76px,13.5vw,205px)/1 var(--body); letter-spacing:-.075em; margin:0 0 38px; }
.build-services .giant-display { font-size:clamp(100px,20vw,290px); margin:10px 0 24px; }
.build-window { overflow-x:auto; overflow-y:hidden; padding:14px max(24px,calc((100vw - 1200px)/2)) 28px; scroll-snap-type:x mandatory; scrollbar-width:thin; }
.build-track { display:flex; gap:24px; width:max-content; }
.build-card { position:relative; display:block; flex:0 0 auto; width:360px; min-height:330px; padding:30px; border-radius:24px; background:white; color:#111; border:1px solid #e9e9e3; text-decoration:none; scroll-snap-align:center; }
.build-card>span { font-size:12px; font-weight:700; color:#666; }
.build-card h3 { font:800 28px/1.25 var(--body); margin:18px 0; }
.build-card p { color:#565952; font-size:16px; }
.build-card .sticker { position:absolute; width:112px; height:130px; right:24px; bottom:20px; }
.build-card>b { position:absolute; bottom:28px; left:30px; font-size:26px; }
.build-window.is-pinned { overflow:hidden; scroll-snap-type:none; }
.ribbon-section { position:relative; height:480px; background:var(--offwhite); display:flex; flex-direction:column; justify-content:center; overflow:hidden; }
.ribbon-backdrop { position:absolute; top:10%; left:5%; font:900 clamp(76px,12vw,180px)/.85 var(--body); color:#e6e6e0; letter-spacing:-.06em; margin:0; }
.growth-ribbon { width:112%; margin-left:-6%; position:relative; padding:10px 0; }
.ribbon-black { background:#111; color:white; transform:rotate(-4deg); z-index:1; }
.ribbon-green { background:#3FB23F; color:#111; transform:rotate(3deg); }
.ribbon-track,.ribbon-group,.ribbon-unit { display:flex; align-items:center; flex-shrink:0; width:max-content; }
.ribbon-unit { gap:30px; padding-right:30px; font:800 clamp(22px,2.5vw,38px)/1.1 var(--body); white-space:nowrap; }
.ribbon-unit::before { content:attr(data-copy); }
.ribbon-star { width:36px; height:36px; flex-shrink:0; }
.ribbon-unit .sticker { width:58px; height:68px; }
.home-section { position:relative; }
.home-section>.container { position:relative; }
.home-section .giant-display { position:relative; z-index:0; }
.section-sticker { position:absolute; width:140px; right:25px; top:0; transform:rotate(7deg); }
.home-cases .section-sticker { top:100px; width:150px; }
.case-row { grid-template-columns:1fr auto 56px; }
.case-sticker { width:52px; height:65px; }
/* 같은 화면에 장식이 과밀해지지 않도록 행 스티커는 현재 행만 켠다(JS 없는 경우 첫 행). */
.case-row:not(:first-child) .case-sticker { visibility:hidden; }
.case-row.is-current .case-sticker { visibility:visible; }
.case-ledger.has-current .case-row:not(.is-current) .case-sticker { visibility:hidden; }
.blueprint .sticker-blueprint { top:auto; bottom:-35px; width:125px; }
.blueprint-notes { padding-right:140px; }
.home-reviews { background:#111; color:white; }
.home-reviews .giant-display { color:#1E1E1E; font-size:clamp(112px,22vw,320px); margin-bottom:-.16em; }
.home-reviews h2 { position:relative; }
.home-reviews .quote-card { padding:32px; background:#222; border:1px solid #444; border-radius:20px; }
.home-review-grid { gap:30px; }
.home-team { background:#FFC71A; --muted:#45401e; }
.home-team .sticker-team { top:60px; right:40%; width:140px; }
.sticker-team::after { content:""; display:block; height:16px; width:150%; background:#111; border-block:3px solid #666; position:absolute; bottom:4px; left:-25%; z-index:-1; }
.crew-badge { background:white; border-radius:22px; border:2px solid #111; }
.field-log { background:var(--offwhite); color:#111; }
.field-log .sticker-journal { width:120px; top:125px; }
.home-final { background:#FFC71A; color:#111; --muted:#45401e; --text:#111; }
.home-final .giant-display { padding-right:120px; font-size:clamp(72px,13vw,190px); }
.home-final .section-sticker { width:160px; }
.home-final .btn-ghost { color:#111; border-color:#111; }
.home-final .home-faq { border-color:#ad8209; }
.home-final .home-faq details { border-color:#ad8209; }
.home-final .home-faq p { color:#45401e; }
.home-final .btn { position:relative; overflow:hidden; isolation:isolate; }
.home-final .btn::before { content:""; position:absolute; inset:0; transform:translateX(-110%); background:repeating-linear-gradient(-45deg,transparent 0 10px,#ffffff30 10px 20px); z-index:-1; }
.section-dots { position:fixed; z-index:30; left:12px; top:50%; transform:translateY(-50%); display:flex; flex-direction:column; padding:10px 6px; border-radius:24px; background:#ffffffdb; box-shadow:0 2px 14px #0002; }
.section-dots a { display:flex; justify-content:center; align-items:center; width:25px; height:27px; position:relative; }
.section-dots a::before { content:""; width:6px; height:6px; border-radius:5px; background:#111; }
.section-dots a[aria-current]::before { height:20px; background:#1F7A3A; }
.section-dots span { position:absolute; left:32px; padding:5px 10px; border-radius:8px; background:#111; color:white; font-size:12px; white-space:nowrap; opacity:0; pointer-events:none; }
.section-dots a:hover span,.section-dots a:focus-visible span { opacity:1; }
.home-page :is(a,button,[tabindex]):focus-visible { outline:3px solid #1F7A3A; outline-offset:5px; }
/* 서브 6개: 본문·섹션은 유지하고 색과 장식만 적용 */
.colorful-sub :is(.case-hero,.page-head,main>.hero) { position:relative; overflow:hidden; background:#FFC71A; color:#111; --text:#111; --muted:#494225; }
.colorful-sub :is(.case-hero,.page-head,main>.hero) h1 { font-family:var(--body); font-weight:900; letter-spacing:-.055em; position:relative; }
.colorful-sub :is(.case-hero,.page-head,main>.hero) .eyebrow { color:#494225; }
.colorful-sub :is(.case-hero,.page-head,main>.hero) :is(.container,.wrap) { position:relative; }
.sub-brand-art { position:relative; height:clamp(130px,18vw,260px); margin-bottom:30px; pointer-events:none; }
.sub-display { position:absolute; left:3%; top:0; white-space:nowrap; font:900 clamp(78px,13vw,200px)/1 var(--body); letter-spacing:-.07em; color:#EBAE00; }
.sub-display::before { content:attr(data-display); }
.sub-brand-art .sticker { position:absolute; right:8%; bottom:0; width:clamp(80px,10vw,150px); height:90%; }
.sub-ribbon { display:block; width:max-content; max-width:100%; background:#111; color:white; transform:rotate(-3deg); padding:10px 18px; margin:24px 0 32px; font:800 clamp(11px,1.2vw,18px)/1.3 var(--body); }
.sub-ribbon::before { content:attr(data-copy); }
.colorful-sub .section-alt { background:var(--offwhite); }
.colorful-sub .cta-banner { background:#FFC71A; color:#111; --muted:#494225; }
.colorful-sub .cta-banner p { color:#494225; }
.colorful-sub .cta-banner .btn-primary { background:#111; color:white; }
.colorful-sub .cta-banner .btn-ghost { color:#111; border-color:#111; }
.colorful-sub.page-subscription .case-hero-inner { padding-top:0; }
.colorful-sub.course-landing .hero-overlay { display:none; }
.colorful-sub.course-landing .hero { padding-top:45px; }
.colorful-sub.course-landing .hero .tools b { color:#111; border-color:#ad8209; }
.colorful-sub.course-landing .hero .hl { color:#111; }
@media(min-width:761px) {
 .colorful-sub .page-head h1 { font-size:clamp(64px,7vw,104px); }
}
@media(max-width:760px) {
 .section-dots { display:none; }
 .welcome-stage { min-height:490px; height:75svh; }
 .bridge-manifesto { font-size:23vw; top:17%; left:-12%; }
 .welcome-mascot { width:170px; }
 .welcome-robot { width:72px; right:6%; top:12%; }
 .welcome-note { left:24px; bottom:5%; }
 .pill-stage { padding:40px 0; }
 .pill-heading { font-size:clamp(33px,9vw,64px); }
 .pill-stage h2 { font-size:25px; }
 .concern-section .concern-title { font-size:36px; }
 .concern-order { border-radius:16px; padding:20px; }
 .concern-panel { gap:20px; }
 .build-services { padding:50px 0 20px; }
 .build-services .giant-display { font-size:21vw; }
 .build-window { padding-inline:20px; }
 .build-track { gap:16px; }
 .build-card { width:min(80vw,340px); min-height:310px; padding:24px; }
 .build-card h3 { font-size:25px; }
 .ribbon-section { height:310px; }
 .ribbon-backdrop { font-size:19vw; top:14%; }
 .ribbon-unit { font-size:22px; gap:20px; padding-right:20px; }
 .ribbon-unit .sticker { width:38px; height:44px; }
 .ribbon-star { width:23px; height:23px; }
 .giant-display { font-size:18vw; margin-bottom:32px; }
 .section-sticker { width:75px!important; right:20px!important; top:80px!important; transform:none; }
 .home-cases .section-sticker { top:90px!important; }
 .home-cases h2 { padding-right:60px; }
 .case-row { grid-template-columns:minmax(0,1fr) auto 24px; gap:10px; }
 .case-sticker { width:24px; height:36px; }
 .blueprint .sticker-blueprint { top:auto!important; bottom:-32px; }
 .blueprint-notes { padding-right:65px; }
 .home-reviews .giant-display { font-size:24vw; }
 .home-reviews .quote-card { padding:24px; }
 .home-team .sticker-team { top:80px!important; }
 .home-final .giant-display { font-size:17vw; padding-right:0; }
 .home-final h2 { padding-right:55px; }
 .home-final .section-sticker { top:115px!important; }
 .sub-brand-art { margin-bottom:12px; }
 .sub-display { font-size:15vw; top:25px; }
 .sub-brand-art .sticker { width:80px; right:5%; }
}
@media(prefers-reduced-motion:reduce) {
 .intro-loader { display:none!important; }
 .home-page *, .colorful-sub * { scroll-behavior:auto!important; }
}
.home-final .button-stripe { position:absolute; inset:0; transform:translateX(-110%); background:repeating-linear-gradient(-45deg,transparent 0 10px,#ffffff35 10px 20px); pointer-events:none; }
.home-page [data-page-bg]:not(.color-welcome):not(.concern-section) { border-top:12px solid transparent; background-clip:padding-box; }
/* 옐로로 바뀐 서브 히어로의 기존 회색 텍스트 대비 보정 */
.colorful-sub .page-head p,.colorful-sub .hero-sub,.colorful-sub .hero-badge { color:#494225; }
.colorful-sub.course-landing .hero .pill { color:#494225!important; border-color:#ad8209!important; }
.colorful-sub :is(.hero,.case-hero) .btn-ghost { color:#111; border-color:#111; }
.home-team .sticker-team { isolation:isolate; }
.ribbon-group { min-width:1600px; justify-content:space-around; }
@media(max-width:760px) { .ribbon-group { min-width:1100px; } }

/* 13장 · 공사 현장 놀이터. 기존 히어로·알약 선택자와 분리한다. */
.fun-section { position:relative; padding:110px 0; background:#F7F7F5; color:#111; }
.fun-section .container { position:relative; }
.fun-label { font-size:14px; font-weight:800; letter-spacing:.04em; margin:0 0 24px; }
.fun-display { font:900 clamp(72px,12.5vw,184px)/.98 var(--body); letter-spacing:-.075em; margin:0; overflow-wrap:normal; }
.fun-heading { position:relative; margin:0 0 55px; }
.fun-prop { position:absolute; right:3%; top:-24px; width:110px; height:110px; object-fit:contain; }
.fun-tape { position:absolute; z-index:2; width:210px; height:120px; object-fit:contain; top:-170px; right:8%; transform:rotate(-13deg); pointer-events:none; }
.fun-section img { object-fit:contain; }
.fun-orbit { padding:0; background:#FFC71A; }
.fun-orbit-pin { min-height:850px; height:100svh; max-height:1100px; padding:65px 0 25px; display:flex; flex-direction:column; }
.fun-orbit .fun-display { font-size:clamp(60px,8vw,120px); }
.orbit-stage { position:relative; width:min(1080px,92%); height:580px; flex:1; min-height:490px; margin:0 auto; }
.orbit-sign { position:absolute; width:260px; left:50%; top:50%; transform:translate(-50%,-50%); z-index:3; }
.orbit-sign img { display:block; width:100%; height:auto; }
.sign-word { position:absolute; inset:6% 6% auto; height:28%; display:grid; place-items:center; font:900 40px/1 var(--body); letter-spacing:-.05em; }
.orbit-item { position:absolute; width:140px; text-align:center; z-index:4; }
.orbit-item img { width:95px; height:95px; margin:auto; display:block; }
.orbit-item span { display:block; font-size:14px; font-weight:800; padding:7px 9px; border-radius:30px; background:#fff; margin-top:5px; white-space:nowrap; }
.orbit-item-0 { left:6%; top:14%; } .orbit-item-1 { right:8%; top:9%; }
.orbit-item-2 { right:0; bottom:11%; } .orbit-item-3 { left:40%; bottom:0; } .orbit-item-4 { left:0; bottom:10%; }
.orbit-summary { text-align:center; margin:15px 15px 0; font-weight:700; }
.fun-piers { position:relative; background:#111; height:620px; overflow:hidden; }
.pier-stage { height:100%; display:flex; align-items:flex-end; }
.pier-stage i { display:block; flex:1; height:100%; background:#FFC71A; transform-origin:bottom; }
.pier-stage i:nth-child(3n+1) { height:52%; } .pier-stage i:nth-child(3n+2) { height:78%; }
.fun-construction { padding:0; background:#111; color:#fff; }
.construction-pin { min-height:850px; height:100svh; max-height:1050px; display:grid; grid-template-columns:1.4fr .8fr 1fr; align-items:center; gap:20px; }
.fun-construction h2 { font:900 clamp(45px,4.4vw,68px)/1.1 var(--body); letter-spacing:-.065em; }
.fun-construction h2 span { display:block; width:max-content; max-width:100%; }
.construction-sprout { width:100%; max-height:390px; }
.construction-copy { font-size:clamp(20px,2vw,30px); font-weight:700; line-height:1.6; }
.fun-completed { padding:0; }
.completed-pin { height:100svh; min-height:900px; max-height:1150px; padding-block:65px 20px; }
.fun-completed .fun-heading { margin-bottom:16px; }
.completed-copy { font-size:24px; font-weight:800; margin:0; }
.completed-stage { position:relative; width:min(650px,80%,calc((100svh - 340px) * .9066)); margin:0 auto; aspect-ratio:1088/1200; }
.round-stage { width:100%; height:100%; position:relative; z-index:2; }
.excavator-rider { position:absolute; width:25%; left:25%; top:65%; z-index:3; }
.excavator-rider img { display:block; width:100%; height:auto; }
.fun-works { padding-top:130px; }
.wall-toolbar { display:flex; align-items:center; justify-content:space-between; gap:20px; }
.wall-toolbar p { font-size:15px; color:#555; }
.wall-reset { border:2px solid #111; background:#FFC71A; color:#111; border-radius:100px; padding:14px 26px; font:800 18px var(--body); flex-shrink:0; cursor:pointer; }
.sticker-wall { position:relative; height:650px; margin:25px 0 90px; border:1px solid #d5d5cf; border-radius:32px; background:radial-gradient(#c9c9c1 1px,transparent 1px) 0 0/20px 20px; overflow:hidden; isolation:isolate; }
.wall-sticker { --dx:0px; --dy:0px; position:absolute; left:var(--sx); top:var(--sy); width:110px; height:120px; padding:0; border:0; background:transparent; transform:translate(calc(-50% + var(--dx)),calc(-50% + var(--dy))) rotate(var(--sr)); cursor:grab; user-select:none; -webkit-user-select:none; touch-action:pan-y; }
.wall-sticker img { display:block; width:100%; height:100%; pointer-events:none; }
.wall-sticker.is-dragging { cursor:grabbing; z-index:5; filter:drop-shadow(0 14px 6px #0003); }
.wall-sticker:focus-visible { z-index:6; }
.wall-status { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
.works-intro h3 { font-size:36px; letter-spacing:-.04em; margin:0 0 16px; }
.works-intro p { font-size:18px; }
.work-stack { margin-top:60px; }
.work-card { position:relative; background:#111; color:#fff; padding:28px; border:1px solid #444; border-radius:28px; margin:0 0 100px; }
.work-index { display:block; color:#FFC71A; font-size:14px; font-weight:800; margin-bottom:18px; }
.work-card video { display:block; width:100%; height:clamp(280px,42vw,570px); object-fit:contain; background:#202020; border-radius:12px; }
.work-card figcaption { font-size:18px; padding:24px 0 8px; }
.work-card .text-link { font-size:14px; color:white; }
.work-stack.is-stacked .work-card { position:sticky; top:calc(35px + var(--stack) * 20px); margin-bottom:230px; }
.fun-keywords { min-height:900px; display:flex; align-items:center; }
.keyword-cloud { display:flex; flex-wrap:wrap; justify-content:center; gap:18px 14px; padding:40px 0; margin:0; list-style:none; }
.keyword-chip { position:relative; padding:18px 28px; font-size:clamp(18px,2vw,30px); font-weight:800; background:white; border:2px solid #111; border-radius:100px; }
.keyword-chip:nth-child(4n+1) { background:#FFC71A; } .keyword-chip:nth-child(7n) { background:#C6F23C; }
.chip-new { width:47px; height:47px; position:absolute; right:-8px; top:-24px; transform:rotate(12deg); }
.fun-specialist { background:linear-gradient(#FFC71A,#EBAE00); }
.specialist-layout { display:grid; grid-template-columns:1fr 1fr; gap:40px; align-items:start; }
.specialist-heading { position:sticky; top:110px; }
.specialist-heading .fun-display { font-size:clamp(65px,7vw,105px); }
.specialist-heading .text-link { color:#111; }
.specialist-card { position:relative; padding:45px; margin:180px 0 260px; background:#fff; border:2px solid #111; border-radius:28px; min-height:400px; box-shadow:10px 10px 0 #111; }
.specialist-card:first-child { margin-top:180px; }
.specialist-card>span { font:900 70px/1 var(--body); color:#1F7A3A; }
.specialist-card h3 { font-size:32px; margin:30px 0 20px; }
.specialist-card p { font-size:20px; line-height:1.65; }
.fun-specialist.is-stacked .specialist-card { position:sticky; top:calc(90px + var(--stack) * 30px); }
.fun-stage { background:#111; color:#fff; }
.fun-stage .fun-heading { padding-right:180px; }
.stage-sprout { position:absolute; right:20px; top:0; width:150px; height:210px; }
.fun-stage .text-link { color:#fff; margin-bottom:40px; }
.fun-horizontal { padding:0; }
.fun-horizontal-pin { padding:80px 0 60px; }
.fun-window { overflow:auto; padding:10px max(24px,calc((100vw - 1200px)/2)) 28px; scroll-snap-type:x mandatory; scrollbar-width:thin; }
.fun-track { display:flex; gap:28px; width:max-content; }
.fun-slide { flex:0 0 auto; width:420px; min-height:360px; scroll-snap-align:center; border-radius:26px; padding:36px; }
.stage-card { background:#222; border:1px solid #666; }
.stage-card .lh-date { display:block; color:#FFC71A; font:900 38px/1.2 var(--body); }
.stage-card h3 { font-size:27px; line-height:1.3; margin:36px 0 22px; }
.stage-card p { color:#ddd; font-size:18px; }
.fun-window.is-pinned { overflow:hidden; scroll-snap-type:none; }
.step-card { background:white; border:2px solid #111; }
.step-order { display:block; font:900 50px/1 var(--body); letter-spacing:-.055em; margin-bottom:28px; }
.step-card .step-num { display:inline-block; background:#FFC71A; color:#111; width:auto; height:auto; border-radius:20px; padding:4px 16px; font:800 16px/1.5 var(--body); }
.step-card h3 { font-size:30px; margin:18px 0; }
.step-card p { font-size:18px; color:#555; line-height:1.6; }
.bot-crew { margin-top:120px; }
.bot-lineup { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:16px; list-style:none; padding:0; margin:50px 0 0; }
.bot-badge { position:relative; min-width:0; text-align:center; }
.bot-badge>img { width:100%; height:190px; object-fit:contain; }
.bot-name { background:white; border:2px solid #111; border-radius:14px; padding:14px 5px; }
.bot-name span { font-size:10px; font-weight:800; letter-spacing:.08em; }
.bot-name h3 { font-size:17px; margin:4px 0; }
.bot-speech { position:absolute; top:-36px; left:50%; transform:translateX(-50%); background:#111; color:white; padding:8px 12px; border-radius:15px; white-space:nowrap; font-size:14px; visibility:hidden; }
.bot-badge:is(:hover,:focus-visible) .bot-speech { visibility:visible; }
.final-celebration { position:relative; height:280px; margin:50px 0 0; }
.final-jump { position:absolute; width:220px; height:260px; left:calc(50% - 110px); object-fit:contain; }
.final-sparkle { position:absolute; left:calc(50% + 100px); top:0; width:90px; height:90px; object-fit:contain; }
.fun-bike-footer { position:relative; background:#FFC71A; color:#111; padding:80px 24px 0; overflow:hidden; }
.fun-bike-footer>p { font:900 clamp(70px,15vw,240px)/1 var(--body); letter-spacing:-.075em; margin:0; white-space:nowrap; text-align:center; }
.bike-road { position:relative; height:380px; margin-top:30px; border-bottom:14px double #111; }
.bike-rider { position:absolute; left:70%; bottom:0; width:190px; height:320px; object-fit:contain; }
.home-page .site-footer:has(.fun-bike-footer) { padding-top:0; }
.home-page .site-footer>.container { padding-top:70px; }
.home-page .section-dots a { height:24px; min-height:24px; }
/* 점 23개: 스크롤 영역으로 만들면 가로 스크롤바가 생기고 호버 이름표가 잘린다 → 낮은 화면에서는 간격만 줄인다 */
@media (max-height:680px){ .home-page .section-dots { padding:6px 6px; } .home-page .section-dots a { height:18px; min-height:18px; } }
@media (hover:hover) and (pointer:fine) { .wall-sticker { touch-action:none; } }
@media(max-width:760px) {
 .fun-section { padding:65px 0; }
 .fun-display { font-size:17vw; }
 .fun-heading { margin-bottom:40px; }
 .fun-label { font-size:12px; margin-bottom:20px; }
 .fun-prop { width:60px; height:60px; top:-30px; right:0; }
 .fun-tape { width:120px; height:70px; top:-100px; right:4%; }
 .fun-orbit,.fun-construction,.fun-completed,.fun-horizontal { padding:0; }
 .fun-orbit-pin { height:90svh; min-height:630px; max-height:820px; padding-top:45px; }
 .fun-orbit .fun-display { font-size:11vw; }
 .orbit-stage { min-height:410px; width:94%; }
 .orbit-sign { width:150px; }
 .sign-word { font-size:24px; }
 .orbit-item { width:105px; }
 .orbit-item img { width:58px; height:65px; }
 .orbit-item span { font-size:10px; padding:5px; }
 .orbit-item-0 { left:0; top:6%; } .orbit-item-1 { right:0; top:6%; }
 .orbit-item-2 { right:0; bottom:10%; } .orbit-item-3 { left:36%; bottom:0; } .orbit-item-4 { left:0; bottom:10%; }
 .orbit-summary { font-size:11px; }
 .fun-piers { height:280px; }
 .construction-pin { display:flex; flex-direction:column; justify-content:center; gap:25px; min-height:740px; height:auto; padding-block:65px; text-align:center; }
 .fun-construction h2 { font-size:12vw; margin:0; }
 .fun-construction h2 span { margin:auto; }
 .construction-sprout { width:160px; height:230px; }
 .construction-copy { font-size:20px; margin:0; }
 .completed-pin { height:auto; min-height:660px; padding-block:65px 20px; }
 .completed-copy { font-size:17px; }
 .completed-stage { width:100%; margin:30px auto 0; }
 .wall-toolbar { align-items:flex-start; gap:12px; }
 .wall-toolbar p { font-size:12px; margin:0; }
 .wall-reset { padding:10px 15px; font-size:15px; }
 .sticker-wall { height:440px; border-radius:20px; margin-bottom:60px; }
 .wall-sticker { width:66px; height:75px; }
 .works-intro h3 { font-size:26px; }
 .work-card { padding:16px; border-radius:18px; margin-bottom:35px; }
 .work-card video { height:240px; }
 .work-card figcaption { font-size:15px; }
 .fun-keywords { min-height:0; }
 .keyword-cloud { gap:16px 8px; padding:20px 0; justify-content:flex-start; }
 .keyword-chip { font-size:16px; padding:12px 16px; }
 .chip-new { width:34px; height:34px; top:-20px; }
 .specialist-layout { display:block; }
 .specialist-heading { position:relative; top:auto; }
 .specialist-heading .fun-display { font-size:17vw; }
 .specialist-card,.specialist-card:first-child { min-height:0; margin:45px 0; padding:26px; box-shadow:6px 6px 0 #111; }
 .specialist-card>span { font-size:46px; }
 .specialist-card h3 { font-size:25px; margin:22px 0 16px; }
 .specialist-card p { font-size:17px; }
 .fun-horizontal-pin { padding:65px 0 40px; }
 .fun-window { padding-inline:20px; }
 .fun-track { gap:16px; }
 .fun-slide { width:min(82vw,370px); min-height:345px; padding:26px; }
 .fun-stage .fun-heading { padding-right:65px; }
 .fun-stage .fun-display { font-size:16vw; }
 .stage-sprout { width:70px; height:105px; top:-20px; right:20px; }
 .stage-card .lh-date { font-size:28px; }
 .stage-card h3 { font-size:24px; }
 .bot-crew { margin-top:70px; }
 .bot-lineup { grid-template-columns:repeat(2,minmax(0,1fr)); gap:40px 15px; }
 .bot-badge>img { height:165px; }
 .bot-name h3 { font-size:16px; }
 .final-celebration { height:240px; }
 .final-jump { width:170px; height:230px; left:calc(50% - 85px); }
 .final-sparkle { width:55px; height:55px; left:calc(50% + 65px); }
 .fun-bike-footer { padding:50px 16px 0; }
 .fun-bike-footer>p { font-size:14.5vw; }
 .bike-road { height:260px; }
 .bike-rider { width:125px; height:220px; left:55%; }
}
@media(prefers-reduced-motion:reduce) {
 .fun-orbit-pin,.construction-pin,.completed-pin { height:auto; }
 .fun-piers { height:150px; }
 .specialist-heading { position:static; }
 .fun-specialist.is-stacked .specialist-card,.work-stack.is-stacked .work-card { position:relative; top:auto; margin-bottom:50px; }
 .wall-sticker { filter:none!important; }
}

/* 14장 · 비전과 철학. 기본 HTML은 JS·CDN 없이도 최종 상태로 읽힌다. */
.bridge-copy>p:last-child { max-width:760px; margin-inline:auto; text-wrap:balance; }
.welcome-stage { height:auto; min-height:100svh; padding:150px 8% 120px; justify-items:start; }
.vision-copy { position:relative; z-index:2; max-width:900px; padding-right:100px; }
.vision-copy h2 { font:900 clamp(42px,5.5vw,80px)/1.2 var(--body); letter-spacing:-.055em; word-break:keep-all; }
.vision-copy .welcome-note { position:static; max-width:660px; font-size:clamp(17px,1.6vw,22px); line-height:1.8; font-weight:500; margin-top:32px; }
.welcome-mascot { position:absolute; right:5%; bottom:6%; width:clamp(100px,13vw,185px); }
.welcome-robot { right:7%; top:9%; width:85px; }
.vision-section { position:relative; padding:130px 0; color:#111; }
.vision-section .container { position:relative; }
.vision-section h2 { font:850 clamp(30px,4vw,58px)/1.3 var(--body); letter-spacing:-.045em; word-break:keep-all; }
.vision-display { font:900 clamp(65px,11vw,165px)/.95 var(--body); letter-spacing:-.065em; color:#EBAE00; margin:0 0 55px; }
.vision-explanation { max-width:850px; font-size:clamp(18px,2vw,25px); line-height:1.8; margin:28px 0; word-break:keep-all; }
.small-team { background:#FFC71A; }
.team-comparison { display:grid; grid-template-columns:1fr 1fr; gap:30px; margin:70px 0 45px; }
.team-side { padding:34px 24px; border:2px solid #111; border-radius:24px; background:#ffffff60; }
.team-side h3 { font-size:25px; margin:0 0 90px; }
.team-chairs { display:flex; align-items:end; justify-content:center; gap:22px; min-height:150px; }
.team-chair { position:relative; width:66px; height:80px; border:3px solid #111; border-radius:12px 12px 0 0; flex-shrink:0; background:#111; color:white; }
.team-chair::before { content:""; position:absolute; left:-7px; right:-7px; bottom:15px; border-top:4px solid currentColor; }
.team-chair::after { content:""; position:absolute; left:3px; right:3px; height:22px; top:100%; border-inline:4px solid #111; }
.team-chair span { display:block; font-size:13px; text-align:center; padding-top:10px; }
.empty-chair { background:transparent; border-style:dashed; color:#111; }
.senior-seat { position:relative; }
.seat-sprout { position:absolute; width:115px; max-width:none; height:auto; left:50%; bottom:20px; transform:translateX(-50%); }
.empty-chair span { position:absolute; top:100%; width:100%; padding-top:29px; }
.team-gap { max-width:900px; font-size:clamp(20px,2.4vw,32px); line-height:1.75; margin-top:65px; word-break:keep-all; }
.seat-answer { display:block; margin-top:18px; }
.concern-order .concern-audience { display:block; min-height:3.4em; font-size:13px; line-height:1.6; letter-spacing:0; }
.service-positioning { max-width:880px; margin:20px 0; font-size:clamp(17px,1.6vw,22px); line-height:1.7; word-break:keep-all; }
.mission-section { background:#F7F7F5; }
.mission-section h2 { max-width:1000px; }
.mission-section .vision-display { color:#dfdfd8; font-size:clamp(46px,7.4vw,110px); margin-top:55px; }
.mission-cycle { position:relative; max-width:1000px; height:650px; margin:0 auto; }
.mission-arrows { position:absolute; inset:0; width:100%; height:100%; color:#1F7A3A; }
.mission-card { position:absolute; width:30%; padding:25px; background:#FFC71A; border:2px solid #111; border-radius:22px; }
.mission-card-0 { top:0; left:35%; }
.mission-card-1 { right:0; bottom:40px; }
.mission-card-2 { left:0; bottom:40px; }
.mission-card img { width:78px; height:84px; object-fit:contain; }
.mission-card h3 { font-size:27px; margin:12px 0; }
.mission-card p { font-size:17px; line-height:1.7; margin:0; word-break:keep-all; }
.mission-return { position:absolute; left:32%; top:55%; width:36%; text-align:center; font-weight:700; font-size:15px; }
.north-star { background:#111; color:white; }
.north-star .vision-display { color:#242424; }
.north-star .kicker { color:#FFC71A; }
.north-star-copy { display:grid; grid-template-columns:1fr 180px; gap:50px; align-items:center; }
.north-star-copy h2 { max-width:920px; }
.north-sparkle { width:100%; height:auto; }
.north-star .container>p:last-child { margin-top:35px; color:#bcbfb8; line-height:1.8; }
.vision-audience { font-size:15px; font-weight:700; margin:20px 0; }
.vision-hook { font-size:clamp(20px,2.2vw,30px); font-weight:750; line-height:1.6; margin:24px 0; }
.vision-quote { border-left:4px solid currentColor; padding:0 0 0 20px; margin:24px 0; }
.vision-quote strong { font-size:25px; }.vision-quote p { font-size:17px; margin:10px 0; }
.about-philosophy { background:#FFC71A; }
.about-vision-sticker { display:block; width:150px; height:auto; margin:40px 0 40px auto; }
.about-mission { padding:60px 0; border-top:2px solid #111; }
.about-mission-steps { display:grid; grid-template-columns:repeat(3,1fr); gap:28px; list-style:none; padding:30px 0; }
.about-mission-steps li { border-top:2px solid #111; padding-top:20px; }
.about-mission-steps h3 { margin:0 0 15px; }
.about-principles { display:grid; grid-template-columns:1fr 1fr; gap:24px; }
.principle-card { background:#fff; border:2px solid #111; border-radius:20px; padding:30px; }
.principle-card>span { font-size:40px; font-weight:900; color:#1F7A3A; }
.principle-card h3 { font-size:24px; margin:15px 0; }
.principle-card p,.about-small-team p { font-size:18px; line-height:1.8; }
.about-small-team { margin-top:70px; max-width:900px; }
.footer-positioning,.footer-slogan { line-height:1.7; }
.course-landing footer .footer-brand { max-width:600px; margin-bottom:30px; }
.course-landing footer .footer-logo { width:203px; height:auto; }
@media(max-width:760px) {
 .welcome-stage { min-height:860px; padding:120px 24px 230px; }
 .vision-copy { padding-right:0; }.vision-copy h2 { font-size:42px; }
 .welcome-mascot { width:110px; right:25px; bottom:45px; }.welcome-robot { width:58px; top:35px; }
 .vision-section { padding:85px 0; }.vision-display { font-size:17vw; margin-bottom:35px; }
 .team-comparison { grid-template-columns:1fr; gap:22px; margin-top:35px; }
 .team-side { padding:25px 16px 50px; }.team-side h3 { font-size:22px; margin-bottom:45px; }
 .team-chairs { gap:15px; min-height:120px; }.team-chair { width:53px; height:70px; }
 .seat-sprout { width:100px; }.team-gap { margin-top:35px; }
 .mission-section .vision-display { font-size:13vw; }
 .mission-cycle { height:auto; display:grid; gap:35px; padding:10px 0; }
 .mission-arrows { display:none; }.mission-card { position:relative; inset:auto; width:100%; padding:24px 24px 24px 108px; min-height:155px; }
 .mission-card img { position:absolute; left:18px; top:28px; width:66px; height:75px; }
 .mission-card h3 { margin:0 0 10px; font-size:24px; }.mission-card:not(.mission-card-2)::after { content:'↓'; position:absolute; left:50%; bottom:-33px; font-size:24px; color:#1F7A3A; }
 .mission-return { position:static; width:auto; color:#1F7A3A; }
 .north-star-copy { grid-template-columns:1fr; gap:25px; }.north-sparkle { width:90px; justify-self:end; }
 .about-mission-steps,.about-principles { grid-template-columns:1fr; }
}
@media(prefers-reduced-motion:reduce) { .seat-sprout,.north-sparkle { will-change:auto; } }

/* 함께한 브랜드 띠 (Works 아래, 결과물 카드 대체) */
.brand-bands { margin-top:48px; display:grid; gap:14px; overflow:hidden; width:100vw; margin-left:calc(50% - 50vw); }
.brand-row { overflow:hidden; }
.brand-track { display:flex; width:max-content; animation:brand-flow 48s linear infinite; }
.brand-row.is-reverse .brand-track { animation-direction:reverse; animation-duration:56s; }
.brand-bands:hover .brand-track { animation-play-state:paused; }
.brand-group { display:flex; align-items:center; gap:14px; padding:0 7px; margin:0; list-style:none; }
.brand-chip { font:900 clamp(22px,3vw,40px)/1 var(--body); letter-spacing:-.03em; padding:.45em .8em; border:2.5px solid #111; border-radius:999px; background:#fff; color:#111; white-space:nowrap; }
.brand-chip.is-dark { background:#111; color:#fff; }
.brand-star { color:#FFC71A; font-size:clamp(22px,2.6vw,36px); line-height:1; -webkit-text-stroke:1.5px #111; }
.brand-bands-note { margin:22px 0 0; font-size:15px; color:#5b5b55; }
@keyframes brand-flow { to { transform:translateX(-50%); } }
@media (max-width:760px) { .brand-bands { margin-top:32px; gap:10px; } .brand-chip { border-width:2px; } }
@media (prefers-reduced-motion:reduce) { .brand-track { animation:none; flex-wrap:wrap; width:auto; } .brand-group[aria-hidden="true"] { display:none; } .brand-group { flex-wrap:wrap; } }

/* 15장: 서브 페이지 전용. 홈에는 적용되지 않는다. */
.colorful-sub.sub-motion { background:var(--page-bg,#F7F7F5); }
.colorful-sub.sub-motion main > :is(section,.page-head) { border-bottom:8px solid var(--page-bg,transparent); }
.colorful-sub.sub-motion .sub-brand-art .sticker { pointer-events:auto; }
.colorful-sub .sub-decor-host { position:relative; }
.colorful-sub .sub-decor { object-fit:contain; }
.colorful-sub .sub-title-prop { display:inline-block; width:52px; height:52px; margin-left:14px; vertical-align:middle; }
.colorful-sub .sub-corner { display:block; width:110px; height:125px; margin:26px 0 0 auto; }
.colorful-sub .sub-tape { position:absolute; width:120px; height:55px; right:5%; top:-25px; z-index:2; pointer-events:none; transform:rotate(-8deg); }
.colorful-sub .sub-price-sticker { display:block; width:120px; height:140px; margin:20px auto 0; }
.colorful-sub .sub-ribbon-ready { width:100%; overflow:hidden; padding-inline:0; }
.colorful-sub .sub-ribbon-ready::before { content:none; }
.colorful-sub .sub-ribbon-track { display:flex; width:max-content; }
.colorful-sub .sub-ribbon-track > span { flex:none; padding-inline:24px; }
.colorful-sub .sub-ribbon-track > span::before { content:attr(data-copy); white-space:nowrap; }
.colorful-sub .sub-button { position:relative; isolation:isolate; overflow:hidden; }
.colorful-sub .sub-button-stripe { position:absolute; inset:0; pointer-events:none; z-index:-1; transform:translateX(-120%); background:repeating-linear-gradient(-45deg,transparent 0 10px,#ffffff45 10px 20px); }
.colorful-sub .sub-horizontal { position:relative; width:100%; max-width:100%; overflow-x:auto; overscroll-behavior-x:contain; scroll-snap-type:x proximity; padding:12px 0 24px; }
.colorful-sub .sub-horizontal-track { display:flex!important; flex-wrap:nowrap; gap:24px; width:max-content; min-width:100%; margin:0; padding:0; }
.colorful-sub .sub-horizontal-track > * { flex:0 0 min(64vw,640px); width:min(64vw,640px); max-width:none; scroll-snap-align:start; margin:0; }
.colorful-sub .sub-horizontal-track.steps > li { padding:30px; border:2px solid currentColor; border-radius:20px; }
.colorful-sub .sub-horizontal-track.steps > li::before { display:none; }
.colorful-sub .sub-horizontal-track.photo-gallery img { width:100%; height:clamp(230px,30vw,440px); object-fit:cover; }
.colorful-sub .sub-pinned { overflow:hidden; scroll-snap-type:none; }
.colorful-sub .sub-horizontal:focus-visible,.colorful-sub .sub-review-marquee:focus-visible { outline:3px solid #1F7A3A; outline-offset:4px; }
.colorful-sub .sub-progress-list { position:relative; --sub-progress:1; }
.colorful-sub .sub-progress-list::after { content:''; position:absolute; left:0; top:0; bottom:0; width:3px; background:#3FB23F; transform:scaleY(var(--sub-progress)); transform-origin:top; pointer-events:none; }
.colorful-sub .sub-progress-list > li { position:relative; padding-left:30px; }
.colorful-sub .sub-progress-list > li::after { content:''; position:absolute; left:-5px; top:8px; width:13px; height:13px; border:2px solid #111; border-radius:50%; background:#FFC71A; transform:scale(calc(.65 + var(--sub-lit,1) * .35)); }
.colorful-sub .sub-brand-row { overflow:hidden; }
.colorful-sub .sub-brand-track { display:flex; width:max-content; }
.colorful-sub .sub-brand-track .marquee-track { flex-shrink:0; animation:none; padding:12px; gap:16px; }
.colorful-sub .sub-brand-track li { padding:14px 25px; border:2px solid #111; border-radius:999px; background:white; color:#111; font-weight:800; }
.colorful-sub.sub-motion .photo-band { overflow:hidden; }
.colorful-sub .sub-schedule { position:relative; --sub-progress:1; }
.colorful-sub .sub-schedule::after { content:''; position:absolute; inset:0 0 auto; height:3px; background:#1F7A3A; transform:scaleX(var(--sub-progress)); transform-origin:left; pointer-events:none; }
.colorful-sub .sub-chairs { display:grid; grid-template-columns:repeat(10,1fr); gap:18px; max-width:740px; margin:32px auto; padding-bottom:18px; }
.colorful-sub .sub-chairs i { position:relative; display:block; height:42px; border:3px solid #111; border-radius:8px 8px 0 0; background:#FFC71A; }
.colorful-sub .sub-chairs i::before { content:''; position:absolute; left:-5px; right:-5px; bottom:3px; height:5px; background:#111; }
.colorful-sub .sub-chairs i::after { content:''; position:absolute; left:2px; right:2px; top:100%; height:13px; border-inline:3px solid #111; }
.colorful-sub .sub-purpose-title { z-index:2; pointer-events:none; }
.colorful-sub .sub-mission-cycle { list-style:none; padding:0; margin-block:40px; }
.colorful-sub .sub-mission-cycle .mission-card { background:#fff; z-index:1; border:2px solid #111; }
.colorful-sub .sub-mission-arrows { pointer-events:none; }
.colorful-sub.sub-motion .post-list li { padding:22px; background:linear-gradient(#FFC71A,#FFC71A) left center / 0% 100% no-repeat; transition:background-size .3s,color .3s; }
.colorful-sub.sub-motion .post-list li:is(:hover,:focus-within) { background-size:100% 100%; color:#111; }
.colorful-sub.sub-motion .post-list li:is(:hover,:focus-within) em { color:#111; }
.colorful-sub.sub-motion .post-list a::after { content:'↗'; display:inline-block; margin-left:14px; transition:transform .25s; }
.colorful-sub.sub-motion .post-list a:is(:hover,:focus-visible)::after { transform:translate(5px,-5px); }
.colorful-sub .sub-channel { position:relative; display:inline-flex; align-items:center; gap:8px; }
.colorful-sub .sub-channel-icon { width:25px; height:28px; opacity:0; }
.colorful-sub .sub-channel:is(:hover,:focus-visible) .sub-channel-icon { opacity:1; }
.colorful-sub.course-landing .sub-review-marquee { display:flex; flex-direction:row; gap:18px; overflow-x:auto; overscroll-behavior-x:contain; padding:12px 3px 24px; }
.colorful-sub.course-landing .sub-review-marquee > .review { flex:0 0 min(82vw,400px); }
.colorful-sub.course-landing .caret,.colorful-sub.course-landing .card-cta { animation:none; }
.colorful-sub .sub-dots { position:fixed; left:12px; top:50%; transform:translateY(-50%); z-index:40; display:grid; gap:2px; border-radius:20px; padding:8px 2px; background:#ffffffdf; }
.colorful-sub .sub-dots a { display:flex; width:28px; min-height:25px; align-items:center; justify-content:center; }
.colorful-sub .sub-dots a::before { content:''; width:6px; height:6px; border-radius:8px; background:#111; transition:height .2s; }
.colorful-sub .sub-dots a[aria-current]::before { height:18px; background:#1F7A3A; }
.colorful-sub .sub-dots a:focus-visible { outline:2px solid #1F7A3A; outline-offset:1px; border-radius:5px; }
@media(min-width:901px) {
 .colorful-sub .sub-ledger { display:block; }
 .colorful-sub .sub-ledger .case-card { display:grid; grid-template-columns:1fr .75fr 1.5fr; align-items:center; gap:24px; border:0; border-bottom:1px solid #ccc; border-radius:0; padding:17px 12px; }
 .colorful-sub .sub-ledger :is(.case-head,.case-metric,.case-desc) { margin:0; }
 .colorful-sub .sub-ledger .case-head h3 { font-size:20px; }
 .colorful-sub .sub-ledger .metric-num { font-size:38px; }
 .colorful-sub .sub-ledger .case-desc { font-size:14px; }
 .colorful-sub .sub-principles { display:block; margin-left:28%; padding-bottom:50px; }
 .colorful-sub .sub-principles .principle-card { position:sticky; top:calc(145px + var(--stack) * 18px); margin-bottom:90px; min-height:260px; }
 .colorful-sub .sub-purpose-title { position:sticky; top:85px; font-size:clamp(38px,5.5vw,80px); }
}
@media(max-width:900px) {
 .colorful-sub .sub-horizontal-track > * { flex-basis:82vw; width:82vw; }
 .colorful-sub .sub-horizontal-track.steps > li { padding:22px; }
 .colorful-sub .sub-dots { display:none; }
 .colorful-sub .sub-title-prop { width:36px; height:36px; margin-left:8px; }
 .colorful-sub .sub-corner { width:80px; height:95px; }
 .colorful-sub .sub-chairs { grid-template-columns:repeat(5,1fr); max-width:340px; gap:30px 20px; }
 .colorful-sub .sub-mission-cycle { height:auto; display:grid; gap:32px; }
 .colorful-sub .sub-mission-cycle .mission-card { position:relative; inset:auto; width:100%; padding:24px; }
 .colorful-sub .sub-mission-arrows { display:none; }
}
@media(prefers-reduced-motion:reduce) {
 .colorful-sub *, .colorful-sub *::before, .colorful-sub *::after { animation:none!important; transition:none!important; scroll-behavior:auto!important; }
}
/* 기존 정적 브랜드 목록 규칙보다 구체적으로 선언한다. */
.colorful-sub .sub-brand-row .marquee-track { display:flex; flex-wrap:nowrap; }
.colorful-sub .sub-brand-row .marquee-track[aria-hidden=true] { display:flex; }
.colorful-sub .sub-progress-list:is(.lecture-history,.steps) { display:block; }
.colorful-sub .sub-progress-list:is(.lecture-history,.steps) > li { margin-bottom:24px; }
.colorful-sub .sub-purpose-title { display:none; }
@media(min-width:901px) {
 .colorful-sub .sub-principles .sub-purpose-title { display:block; float:left; width:34%; margin-left:-39%; position:sticky; top:120px; font-size:clamp(28px,3vw,44px); font-weight:900; line-height:1.1; color:#111; }
 .colorful-sub .sub-purpose-title::before { content:attr(data-display); }
}

/* 쿠폰 페이지 헤더·푸터의 흰 글자 대비도 항상 유지한다. */
.colorful-sub.course-landing.sub-motion { background:var(--ink); }

/* 16장: 공통 캡슐 헤더. 기존 페이지/쿠폰 전용 헤더 규칙보다 우선한다. */
body .site-header.bridge-header {
  position: relative; inset: auto; z-index: 100; display: flex; align-items: center;
  justify-content: space-between; gap: 16px; width: 100%; min-height: 84px;
  padding: 14px 32px; border: 0; background: transparent; backdrop-filter: none;
  pointer-events: none; transition: transform .24s ease;
}
body .site-header.bridge-header.header-enhanced { position: fixed; inset: 0 0 auto; }
body .site-header.bridge-header.header-away { transform: translateY(-110%); }
body.header-enhanced-page:not(.home-page) { padding-top: 84px; }
body .bridge-header .logo { pointer-events: auto; }
body .bridge-header .logo img { width: 169px; height: 30px; filter: brightness(0) invert(1); }
body .bridge-header .header-capsule { display: flex; align-items: center; gap: 5px; padding: 5px; background: #111e; border-radius: 40px; pointer-events: auto; }
.header-actions { display: flex; gap: 5px; }
body .header-actions a, body .header-bottom-bar a {
  display: flex; align-items: center; justify-content: center; gap: 7px; min-height: 44px;
  padding: 10px 19px; border-radius: 30px; background: #fff; color: #111; font: 800 14px/1.2 Pretendard, sans-serif; white-space: nowrap;
}
body .header-actions a:first-child, body .header-bottom-bar a:first-child { background: #FFC71A; }
.header-menu { position: static; padding: 0; margin: 0; border: 0; }
body .header-menu-toggle { display: grid; place-items: center; width: 44px; height: 44px; padding: 0; margin: 0; border: 0; border-radius: 16px; background: #111; color: #fff; cursor: pointer; list-style: none; }
.header-menu-toggle::-webkit-details-marker { display: none; }
.header-menu-toggle::after { display: none; }
.header-menu-icon { position: relative; width: 20px; height: 20px; }
.header-menu-icon i { position: absolute; width: 6px; height: 6px; background: #fff; border-radius: 2px; transition: transform .2s, width .2s, height .2s; }
.header-menu-icon i:nth-child(1) { left: 0; top: 0; }
.header-menu-icon i:nth-child(2) { right: 0; top: 0; }
.header-menu-icon i:nth-child(3) { left: 0; bottom: 0; }
.header-menu-icon i:nth-child(4) { right: 0; bottom: 0; }
.header-menu[open] .header-menu-icon i { width: 24px; height: 2px; left: -2px; top: 9px; transform: rotate(45deg); }
.header-menu[open] .header-menu-icon i:nth-child(even) { transform: rotate(-45deg); }
.header-enhanced:not(.header-menu-open) .header-menu-icon i { width: 6px; height: 6px; transform: none; left: auto; top: auto; }
.header-enhanced:not(.header-menu-open) .header-menu-icon i:nth-child(1) { left: 0; top: 0; }
.header-enhanced:not(.header-menu-open) .header-menu-icon i:nth-child(2) { right: 0; top: 0; }
.header-enhanced:not(.header-menu-open) .header-menu-icon i:nth-child(3) { left: 0; bottom: 0; }
.header-enhanced:not(.header-menu-open) .header-menu-icon i:nth-child(4) { right: 0; bottom: 0; }
body .bridge-header nav.header-menu-panel {
  position: absolute; top: calc(100% - 4px); right: 32px; display: grid; gap: 8px;
  width: min(390px, calc(100vw - 32px)); height: auto; max-height: calc(100svh - 100px);
  margin: 0; padding: 4px 4px 30px; overflow-y: auto; overscroll-behavior: contain;
  color: #111; text-align: left; scrollbar-width: thin;
}
.header-menu-card { border-radius: 18px; padding: 14px 20px; background: #fff; box-shadow: 0 4px 14px #0002; }
.header-menu-card p { margin: 0 0 5px; color: #6B6F6A; font: 700 11px/1.4 Pretendard, sans-serif; letter-spacing: .09em; text-transform: uppercase; }
body .bridge-header .header-menu-card a { display: block; width: fit-content; padding: 5px 0; color: #111; font: 800 17px/1.35 Pretendard, sans-serif; text-decoration: none; }
body .bridge-header .header-menu-card a:hover, body .bridge-header .header-menu-card a[aria-current="page"] { text-decoration: underline; text-decoration-color: #FFC71A; text-decoration-thickness: 5px; text-underline-offset: 3px; }
.header-menu-sticker { width: 62px; height: 78px; object-fit: contain; justify-self: end; margin-top: -37px; margin-right: 6px; pointer-events: none; }
body .header-bottom-bar { display: none; }
body .header-desktop-top { position: fixed; right: 28px; bottom: 28px; z-index: 90; display: grid; place-items: center; width: 48px; height: 48px; border: 1px solid #ddd; border-radius: 12px; background: #fff; color: #111; font-size: 24px; }
body.header-enhanced-page:not(.header-past-first) .header-desktop-top { visibility: hidden; }
body.course-landing .header-desktop-top { bottom: 100px; }
.bridge-header :focus-visible, .header-bottom-bar :focus-visible, .header-desktop-top:focus-visible { outline: 3px solid #1F7A3A; outline-offset: 3px; }
#about-vision, #online, #seminar { scroll-margin-top: 100px; }
@media (max-width: 760px) {
  body .site-header.bridge-header { min-height: 72px; padding: 10px 16px; }
  body.header-enhanced-page:not(.home-page) { padding-top: 72px; }
  body .bridge-header .logo img { width: 146px; height: 26px; }
  .header-actions { display: none; }
  body .bridge-header nav.header-menu-panel { right: 12px; max-height: calc(100svh - 158px - env(safe-area-inset-bottom)); }
  body:has(.header-bottom-bar) { padding-bottom: calc(80px + env(safe-area-inset-bottom)); }
  body nav.header-bottom-bar { position: fixed; inset: auto 0 0; z-index: 95; display: grid; grid-template-columns: 1.4fr 1fr 44px; gap: 6px; padding: 8px 12px calc(8px + env(safe-area-inset-bottom)); background: #111; }
  body .header-bottom-bar a { padding: 12px 8px; min-height: 46px; }
  body .header-bottom-bar .header-top-link { background: #111; color: #fff; border: 1px solid #666; border-radius: 12px; font-size: 24px; }
  body .header-desktop-top { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  body .site-header.bridge-header, .header-menu-icon i { transition: none; }
}
/* 고정 헤더의 합성 경계에 의존하지 않고, 실제 배경 밝기로 로고를 전환한다. */
body .bridge-header .logo { mix-blend-mode: normal; }
body .bridge-header .logo img { filter: brightness(0); }
body.home-page .bridge-header:not(.header-enhanced) .logo img,
body .bridge-header.header-light-logo .logo img { filter: brightness(0) invert(1); }
body .bridge-header .header-menu { border: 0; background: transparent; box-shadow: none; padding: 0; }
body .bridge-header nav.header-menu-panel { align-items: stretch; justify-content: stretch; }

body.home-page .site-header.bridge-header { background: transparent; }

/* 17장: 기록 목록과 상세. 공통 헤더·리본·서브 페이지 표면을 재사용한다. */
.record-tabs,.record-filters{display:flex;flex-wrap:wrap;gap:10px;margin:24px 0}
.record-tabs a,.record-filters button,.record-pill,.record-tags li{border:1px solid currentColor;border-radius:999px;padding:9px 16px;font-size:14px}
.record-tabs a[aria-current],.record-filters button[aria-pressed="true"]{background:#111;color:#fff}
.record-filters button{cursor:pointer;background:#fff;font:inherit}
.record-filters[hidden],.record-work[hidden]{display:none!important}
.record-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;margin:30px 0}
.record-work{position:relative;min-width:0;min-height:350px;padding:30px 26px 130px;background:#FFC71A;color:#111;border-radius:18px;overflow:hidden;transition:transform .25s}
.record-work:nth-child(3n+2){background:#111;color:#fff}
.record-work:nth-child(3n){background:#F7F7F5;color:#111;border:1px solid #ddd}
.record-work h3{font-size:clamp(26px,3vw,40px);line-height:1.25;margin:22px 0 14px;overflow-wrap:anywhere}
.record-work p{font-size:15px;margin:8px 0}
.record-work img{position:absolute;bottom:12px;right:16px;object-fit:contain;transition:transform .25s}
.record-tags{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:6px}
.record-tags li{font-size:12px;padding:5px 9px}
.record-status{font-size:13px;font-weight:700}
.record-status.is-active::before{content:"";display:inline-block;width:9px;height:9px;border-radius:50%;background:#1F7A3A;margin-right:7px;border:1px solid currentColor}
.record-work:nth-child(3n+2) .record-status.is-active::before{background:#4CC764}
.record-count{display:inline-block;font-size:.6em;border:2px solid currentColor;border-radius:999px;padding:5px 16px;vertical-align:middle}
.record-lecture{display:flex;flex-direction:column;align-items:flex-start;gap:14px;min-width:0;padding:26px;border:1px solid #ddd;border-radius:16px;background:#fff;color:#111}
.record-lecture h3{font-size:25px;line-height:1.3;margin:0}
.record-lecture p{margin:0;overflow-wrap:anywhere}
.record-lecture img{width:100%;height:180px;object-fit:cover;border-radius:10px}
.record-pending{font-size:13px;color:#6B6F6A;margin-top:auto}
.record-detail{max-width:960px;padding-top:160px;padding-bottom:70px;overflow-wrap:anywhere}
.record-detail h1{font-size:clamp(30px,4.5vw,58px);line-height:1.3;margin:30px 0}
.record-detail h2{font-size:clamp(25px,3vw,36px);margin-bottom:24px}
.record-detail section{margin-top:64px}
.record-breadcrumb{font-size:14px;line-height:2}
.record-summary{padding:28px;background:#FFC71A;color:#111;border-radius:16px;margin:32px 0;line-height:1.85}
.record-overview{width:100%;border-collapse:collapse;table-layout:fixed;margin:48px 0}
.record-overview caption{text-align:left;font-size:28px;font-weight:800;margin-bottom:18px}
.record-overview th,.record-overview td{padding:16px;border-bottom:1px solid #ccc;text-align:left;vertical-align:top}
.record-overview th{width:25%;background:#F7F7F5}
.record-photos img{width:100%;height:auto}.record-photos figure{margin:24px 0}.record-photos figcaption{font-size:14px;margin-top:12px}
.record-detail li{margin-bottom:14px}.record-detail blockquote{border-left:4px solid #FFC71A;padding:20px;margin:0}
@media(hover:hover) and (min-width:901px) and (prefers-reduced-motion:no-preference){.record-work:hover{transform:translateY(-5px) rotate(-1deg)}.record-work:hover img{transform:translateY(-8px) rotate(9deg)}a.record-lecture:hover{border-color:#111;background:#fff9e5}}
@media(max-width:900px){.record-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.record-grid{grid-template-columns:1fr}.record-detail{padding-top:125px}.record-work{min-height:320px}.record-tabs a{font-size:13px;padding:8px 12px}.record-summary{padding:22px}.record-overview th,.record-overview td{padding:12px}.record-detail .record-grid{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){.record-work,.record-work img{transition:none}}
/* 글자 표지: 현장 사진이 없는 강의 기록 */
.record-type{display:flex;flex-direction:column;justify-content:space-between;width:100%;height:180px;padding:18px 20px;border-radius:10px;overflow:hidden;background:#FFC71A;color:#111}
.record-type--1{background:#15251C;color:#F7F7F5}.record-type--1 strong{color:#C6F23C}
.record-type--2{background:#C6F23C;color:#15251C}
.record-type strong{text-wrap:balance;font-size:clamp(30px,3.4vw,44px);line-height:1.05;letter-spacing:-.03em;font-weight:900;overflow-wrap:anywhere}
.record-type__date,.record-type__sub{font-size:13px;font-weight:700;letter-spacing:.04em}
.record-type--hero{height:auto;min-height:300px;padding:32px 36px;border-radius:16px;margin:32px 0}
.record-type--hero strong{font-size:clamp(52px,9vw,120px)}
.record-type--hero .record-type__date,.record-type--hero .record-type__sub{font-size:15px}
@media(max-width:600px){.record-type--hero{min-height:220px;padding:24px}}
/* 히어로 슬로건: 다리 공사 진행에 맞춰 한 단어씩 떠오름(JS 없거나 모션 줄이기면 처음부터 전부 보임) */
.bridge-tagline{position:absolute;left:clamp(20px,4vw,64px);right:clamp(20px,4vw,64px);bottom:84px;margin:0;max-width:1100px;font-size:clamp(38px,5.6vw,92px);line-height:1.08;font-weight:900;letter-spacing:-.035em;color:#fff;text-shadow:0 4px 28px #07101b,0 1px 4px #07101b;word-break:keep-all}
.bridge-tagline .tl-line{display:block}
.bridge-tagline .tl-word{--v:var(--tl,var(--tl-default,1));display:inline-block;opacity:var(--v);transform:translateY(calc((1 - var(--v)) * .45em)) scale(calc(.92 + var(--v) * .08));filter:blur(calc((1 - var(--v)) * 10px));transform-origin:left bottom;will-change:opacity,transform}
.bridge-scene.is-scrubbed .bridge-tagline .tl-word{--tl-default:0}
@media(max-width:760px){.bridge-tagline{bottom:124px;font-size:clamp(28px,8vw,42px);line-height:1.14}}
/* On Stage: 강의 현장 사진 카드 */
.stage-photo{display:flex;flex-direction:column;gap:18px;padding:14px 14px 26px;color:#fff;text-decoration:none;transition:border-color .2s,transform .25s}
.stage-photo img{width:100%;height:230px;object-fit:cover;border-radius:16px;display:block}
.stage-photo>div{padding:0 12px}
.stage-photo .lh-date{font-size:26px}
.stage-photo h3{margin:10px 0 8px;font-size:22px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.stage-photo p{font-size:15px;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden}
@media(hover:hover){.stage-photo:hover{border-color:#FFC71A;transform:translateY(-6px)}}
@media(max-width:760px){.stage-photo img{height:190px}.stage-photo h3{font-size:19px}}
/* 2026-09-26 히어로 문구: 흰색만, 굵기 대비로 정리(옐로 강조 없음) */
.bridge-copy{text-shadow:0 1px 18px rgba(7,16,27,.55)}
.bridge-copy .kicker{font-family:var(--body);font-weight:500;font-size:12px;letter-spacing:.32em;opacity:.8}
.bridge-copy .hero-title{font-family:var(--body);font-weight:700;font-size:clamp(34px,4.4vw,64px);line-height:1.18;letter-spacing:-.035em;margin:18px 0 0}
.hero-title .ht-line{display:block}
.hero-title .ht-word{display:inline-block}
.bridge-tagline{font-family:var(--body);font-weight:700;font-size:clamp(36px,5.2vw,84px);line-height:1.1;letter-spacing:-.04em;text-shadow:0 1px 22px rgba(7,16,27,.6)}
.bridge-tagline .tl-light{font-weight:200;letter-spacing:-.02em}
@media(max-width:760px){.bridge-copy .hero-title{font-size:clamp(28px,7.6vw,40px)}.bridge-tagline{font-size:clamp(28px,8vw,42px)}}
/* 슬로건은 첫 문장이 사라진 같은 자리(하늘 영역)에서 이어받는다 */
.bridge-tagline{top:150px;bottom:auto}
@media(max-width:760px){.bridge-tagline{top:112px;bottom:auto}}
/* AI × Data Driven: 세리프 이탤릭(A안, 2026-09-26 저자 선택) */
.bridge-tagline .tl-light{font-family:'Instrument Serif',Georgia,'Times New Roman',serif;font-style:italic;font-weight:400;letter-spacing:-.01em;font-size:1.08em}
/* Seasons. (2026-09-26) — 시즌마다 한 층씩 쌓이는 마케팅 빌딩 */
.home-seasons{background:#15251C;color:#F7F7F5;overflow:hidden;background-image:linear-gradient(rgba(255,255,255,.045) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.045) 1px,transparent 1px);background-size:48px 48px}
.home-seasons .seasons-display{color:#F7F7F5;font-size:clamp(72px,11vw,168px);margin-bottom:18px}
.home-seasons .kicker{color:#C6F23C}
.home-seasons h2{color:#fff;margin:10px 0 48px;text-wrap:balance}
.seasons-body{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(28px,4vw,64px);align-items:end}
.season-cards{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.season-card{border:1px solid rgba(247,247,245,.28);border-radius:20px;padding:24px 26px;background:rgba(21,37,28,.7)}
.season-no{display:inline-block;font:900 13px/1 var(--body);letter-spacing:.16em;padding:7px 11px;border-radius:999px;background:#FFC71A;color:#15251C}
.season-card[data-season="2"] .season-no{background:#C6F23C}
.season-card[data-season="3"] .season-no{background:#F7F7F5}
.season-card h3{font-size:clamp(22px,2.2vw,30px);line-height:1.25;margin:14px 0 6px;color:#fff}
.season-org{margin:0 0 10px;font-weight:700;color:rgba(247,247,245,.72);font-size:15px}
.season-desc{margin:0;line-height:1.7;color:rgba(247,247,245,.9);font-size:16px}
.season-building{position:relative;padding-top:88px}
.building-sprout{position:absolute;right:8%;top:0;width:96px;height:auto;z-index:2}
.building-floors{list-style:none;margin:0;padding:0;display:flex;flex-direction:column-reverse;gap:10px}
.floor{display:grid;gap:8px}
.floor-label{font:800 12px/1 var(--body);letter-spacing:.14em;color:rgba(247,247,245,.6)}
.floor-bricks{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.brick{display:flex;align-items:center;justify-content:center;text-align:center;min-height:58px;padding:10px 8px;border-radius:12px;font-weight:800;font-size:clamp(13px,1.1vw,16px);line-height:1.3;word-break:keep-all;background:#FFC71A;color:#15251C;box-shadow:inset 0 -4px 0 rgba(0,0,0,.14)}
.floor[data-floor="2"] .brick{background:#C6F23C}
.floor[data-floor="3"] .brick{background:#F7F7F5}
.season-rail{list-style:none;margin:22px 0 0;padding:0;display:flex;justify-content:space-between;gap:10px;font:800 11px/1.2 var(--body);letter-spacing:.12em;color:rgba(247,247,245,.55);border-top:1px dashed rgba(247,247,245,.3);padding-top:14px}
.season-rail li{display:flex;align-items:center;gap:8px}
.season-rail i{width:10px;height:10px;border-radius:50%;background:#C6F23C;box-shadow:0 0 0 4px rgba(198,242,60,.18)}
.seasons-close{margin:44px 0 0;font-size:clamp(20px,2.2vw,30px);font-weight:800;line-height:1.45;color:#fff;max-width:900px;text-wrap:balance}
.seasons-close .text-link{display:inline-block;margin-left:10px;font-size:16px;color:#C6F23C}
/* 모션 초기 상태(JS가 is-animated를 붙일 때만). 모션 줄이기·JS 없음이면 완성 상태 그대로 */
.home-seasons.is-animated .brick{opacity:0}
.home-seasons.is-animated .season-rail i{background:transparent;box-shadow:inset 0 0 0 2px rgba(247,247,245,.4)}
.home-seasons.is-animated .season-rail li.is-on i{background:#C6F23C;box-shadow:0 0 0 4px rgba(198,242,60,.18)}
.home-seasons.is-animated .season-rail li.is-on{color:#F7F7F5}
.home-seasons.is-animated .floor-bricks{background-image:none}
.home-seasons.is-animated .floor{position:relative}
.home-seasons.is-animated .floor-bricks::after{content:"";position:absolute;inset:20px 0 0;border:1.5px dashed rgba(247,247,245,.28);border-radius:12px;pointer-events:none;transition:opacity .4s}
.home-seasons.is-animated .floor.is-built .floor-bricks::after{opacity:0}
@media(min-width:901px){
 .home-seasons.is-pinned .season-cards{position:relative;min-height:230px}
 .home-seasons.is-pinned .season-card{position:absolute;inset:auto 0 0 0}
}
@media(max-width:900px){.seasons-body{grid-template-columns:1fr}.season-building{padding-top:76px}}
@media(max-width:760px){
 .home-seasons .seasons-display{font-size:19vw}
 .home-seasons h2{margin-bottom:32px}
 .season-card{padding:20px}
 .brick{min-height:52px;font-size:13px}
 .floor-bricks{grid-template-columns:repeat(2,minmax(0,1fr))}
 .building-sprout{width:76px}
 .season-rail{font-size:10px;letter-spacing:.06em}
 .seasons-close .text-link{display:block;margin:12px 0 0}
}
@media(min-width:901px){
 .home-seasons{padding:56px 0}
 .home-seasons .seasons-display{font-size:clamp(64px,7.5vw,116px);margin-bottom:6px}
 .home-seasons h2{font-size:clamp(30px,3.4vw,48px);margin:6px 0 28px}
 .floor-bricks{grid-template-columns:repeat(6,minmax(0,1fr))}
 .brick{min-height:66px;font-size:14px}
 .season-building{padding-top:78px}
 .building-sprout{width:84px}
 .season-left{display:flex;flex-direction:column;gap:22px}
 .seasons-close{margin:0;font-size:clamp(18px,1.6vw,23px)}
 .seasons-close .text-link{display:block;margin:10px 0 0}
}
@media(max-width:900px){.season-left{display:contents}.season-cards{order:1}.season-building{order:2}.seasons-close{order:3;margin-top:8px}.seasons-body{display:flex;flex-direction:column;align-items:stretch}}
/* 히어로 인터뷰 영상 화면(2026-09-26 2차): 스크롤 74%→86%에 떠올라 소리 없이 재생. JS 없으면 처음부터 보이는 썸네일+링크 */
.hero-interview{--v:var(--hv,1);position:absolute;right:clamp(20px,4vw,64px);bottom:88px;z-index:4;width:min(44vw,720px);margin:0;opacity:var(--v);transform:translateY(calc((1 - var(--v)) * 60px)) scale(calc(.92 + var(--v) * .08));transform-origin:right bottom;pointer-events:none}
.bridge-scene.is-scrubbed .hero-interview{--v:var(--hv,0)}
.hero-interview.is-live,.bridge-scene:not(.is-scrubbed) .hero-interview{pointer-events:auto}
.hero-interview figcaption{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin:0 0 10px;color:#fff;font:600 12px/1.2 var(--body);letter-spacing:.18em;text-shadow:0 1px 10px rgba(7,16,27,.7)}
.hero-interview figcaption a{color:#fff;letter-spacing:.02em;font-weight:500;opacity:.8;text-decoration:none}
.hv-screen{position:relative;aspect-ratio:16/9;border-radius:16px;overflow:hidden;background:#000;box-shadow:0 30px 80px rgba(0,0,0,.55),0 0 0 1px rgba(255,255,255,.22)}
.hv-screen img,.hv-screen iframe{position:absolute;inset:0;width:100%;height:100%;border:0;object-fit:cover;display:block}
@media(min-width:761px){.bridge-copy,.bridge-tagline,.bridge-foot{left:max(92px,4vw)}}
@media(max-width:760px){.hero-interview{left:20px;right:20px;width:auto;bottom:104px;transform-origin:center bottom}.hero-interview figcaption{font-size:10px;letter-spacing:.12em}}

/* 코호트 상세 (2026-09-26): 공통 페이지에 영향을 주지 않는 전용 스타일. */
body.cohort-page { background:#fff; color:#0B0B0A; padding-bottom:0; }
.cohort-page main { font:400 17px/1.7 "Pretendard",sans-serif; word-break:keep-all; }
.cohort-page .cohort-shell { width:calc(100% - 64px); max-width:1200px; margin-inline:auto; }
.cohort-page main :is(h1,h2,h3) { font-family:inherit; letter-spacing:-.035em; color:inherit; }
.cohort-page main h1 { font-size:clamp(32px,3.4vw,48px); line-height:1.24; font-weight:800; margin:22px 0; }
.cohort-page main h2 { font-size:38px; font-weight:800; line-height:1.3; margin:18px 0 22px; }
/* site.js의 공통 제목 리빌은 이 페이지에서 정적으로 표시한다. */
.cohort-page main .title-line { display:inline; overflow:visible; }
.cohort-page main .title-line > span { display:inline; transform:none!important; }
.cohort-page main h3 { font-size:20px; line-height:1.45; margin:0 0 12px; }
.cohort-page main p { margin:0 0 18px; }
.cohort-page main figure { margin:0; }
.cohort-page main figcaption { font-size:13px; line-height:1.6; margin-top:12px; color:#6B6F6A; }
.cohort-page main :is(a,button,summary):focus-visible { outline:3px solid #1F7A3A; outline-offset:4px; }
.cohort-page .cohort-hero { background:#15251C; color:#fff; padding:64px 0 60px; }
.cohort-page .cohort-hero-grid { display:grid; grid-template-columns:minmax(0,1.6fr) minmax(0,1fr); gap:64px; align-items:center; }
.cohort-page .cohort-hero figure img { width:100%; height:480px; object-fit:cover; border-radius:16px; }
.cohort-page .cohort-hero figcaption { color:#fff; opacity:.8; }
.cohort-page .cohort-badge { display:inline-block; border-radius:999px; padding:5px 10px; color:#1F7A3A; background:#F4F4F1; font-size:12px; font-weight:700; line-height:1.6; }
.cohort-page .cohort-hero .cohort-badge { font-size:14px; }
.cohort-page .cohort-facts { display:grid; grid-template-columns:1fr 1fr; gap:12px 20px; margin:28px 0 22px; }
.cohort-page .cohort-facts > div { border-top:1px solid #ffffff30; padding-top:10px; }
.cohort-page .cohort-facts dt { font-size:12px; opacity:.7; }
.cohort-page .cohort-facts dd { margin:2px 0 0; font-size:15px; font-weight:600; }
.cohort-page .cohort-assurance { font-size:14px; }
.cohort-page .cohort-actions { display:flex; flex-wrap:wrap; gap:10px; margin-top:24px; }
.cohort-page .cohort-button { display:inline-flex; justify-content:center; align-items:center; min-height:48px; padding:11px 18px; border:1px solid #E7E5E0; border-radius:10px; font-size:15px; line-height:1.5; font-weight:750; text-decoration:none; transition:transform .2s ease-out; }
.cohort-page .cohort-primary { background:#FFC71A; color:#0B0B0A; border-color:#FFC71A; }
.cohort-page .cohort-secondary { background:#fff; color:#0B0B0A; }
.cohort-page .cohort-hero .cohort-secondary { background:transparent; color:#fff; border-color:#ffffff70; }
.cohort-page .cohort-worry { background:#F7F7F5; padding:68px 0; }
.cohort-page .cohort-worry-grid { display:grid; grid-template-columns:1.1fr 1fr; gap:64px; align-items:center; }
.cohort-page .cohort-worry h2 { font-size:32px; }
.cohort-page .cohort-label { display:inline-block; padding:5px 11px; border:1px solid #E7E5E0; border-radius:999px; color:#6B6F6A; font-size:11px; font-weight:750; letter-spacing:.08em; }
.cohort-page .cohort-checks { list-style:none; margin:18px 0 0; padding:0; display:flex; flex-wrap:wrap; gap:8px 14px; font-size:13px; }
.cohort-page .cohort-checks li::before { content:'✓'; color:#1F7A3A; font-weight:800; margin-right:6px; }
.cohort-page .cohort-terminal { background:#15251C; color:#fff; border-radius:16px; padding:24px; font:14px/1.8 ui-monospace,monospace; overflow-wrap:anywhere; }
.cohort-page .cohort-window-dots { font-size:10px; letter-spacing:5px; color:#9CA19B; border-bottom:1px solid #ffffff30; padding-bottom:16px; margin-bottom:22px; }
.cohort-page .cohort-terminal p:last-child { margin:0; }
.cohort-page .cohort-layout { display:grid; grid-template-columns:minmax(0,1fr) 360px; gap:48px; align-items:start; padding-top:64px; padding-bottom:96px; }
.cohort-page .cohort-content { grid-column:1; grid-row:1; min-width:0; }
.cohort-page .cohort-card { grid-column:2; grid-row:1; position:sticky; top:100px; padding:24px; border:1px solid #E7E5E0; border-radius:16px; background:#fff; box-shadow:0 8px 32px #0B0B0A0a; font-size:13px; line-height:1.55; max-height:calc(100svh - 116px); overflow-y:auto; }
.cohort-page .cohort-card-badges { display:flex; justify-content:space-between; align-items:center; gap:6px; font-size:12px; }
.cohort-page .cohort-card .cohort-price { font-size:38px; font-weight:850; line-height:1.25; letter-spacing:-.045em; margin:18px 0 12px; }
.cohort-page .cohort-price span { background:linear-gradient(transparent 72%,#FFC71A 72%); }
.cohort-page .cohort-card .cohort-deadline { font-size:13px; padding-bottom:16px; border-bottom:1px solid #E7E5E0; margin-bottom:16px; }
.cohort-page .cohort-deadline strong { margin-left:8px; }
.cohort-page .cohort-card-facts { margin:0 0 18px; }
.cohort-page .cohort-card-facts > div { display:grid; grid-template-columns:34px minmax(0,1fr); gap:12px; margin:8px 0; }
.cohort-page .cohort-card-facts dt { color:#6B6F6A; }
.cohort-page .cohort-card-facts dd { margin:0; }
.cohort-page .cohort-card-included { border-top:1px solid #E7E5E0; margin-bottom:18px; }
.cohort-page .cohort-card-included .cohort-checks { display:grid; gap:5px; margin-top:14px; }
.cohort-page .cohort-card .cohort-button { width:100%; margin-bottom:8px; }
.cohort-page .cohort-card .cohort-small { text-align:center; font-size:11px; color:#6B6F6A; margin:5px 0 16px; }
.cohort-page .cohort-card .cohort-next { margin:0; padding-top:14px; border-top:1px solid #E7E5E0; font-size:11px; color:#6B6F6A; }
.cohort-page .cohort-section { padding:0 0 64px; margin:0 0 64px; border-bottom:1px solid #E7E5E0; scroll-margin-top:100px; }
.cohort-page .cohort-section:last-child { margin:0; border:0; padding-bottom:0; }
.cohort-page .section-lead { font-size:17px; line-height:1.7; color:#6B6F6A; margin:0 0 28px; max-width:none; }
.cohort-page .cohort-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.cohort-page :is(.cohort-box,.cohort-quote,.cohort-output,.cohort-part) { border:1px solid #E7E5E0; border-radius:16px; background:#fff; padding:24px; min-width:0; transition:transform .2s ease-out; }
.cohort-page .cohort-box :is(p,li),.cohort-page .cohort-quote p { font-size:16px; }
.cohort-page .cohort-box p:last-child { margin-bottom:0; }
.cohort-page .cohort-box ul { margin:0; padding-left:20px; }
.cohort-page .cohort-box li + li { margin-top:10px; }
.cohort-page .pillar-num { display:block; color:#6B6F6A; font-size:13px; font-weight:700; margin-bottom:20px; }
.cohort-page .cohort-parts { list-style:none; padding:0; display:grid; gap:16px; }
.cohort-page .cohort-part-head { display:grid; grid-template-columns:32px 1fr auto; gap:10px; align-items:baseline; margin-bottom:18px; }
.cohort-page .cohort-part-head h3 { margin:0; }
.cohort-page .cohort-part-head > span { font-size:13px; color:#6B6F6A; white-space:nowrap; }
.cohort-page .cohort-part p { font-size:16px; }
.cohort-page .cohort-part .cohort-badge { margin-bottom:14px; }
.cohort-page main details { border:1px solid #E7E5E0; border-radius:12px; padding:0 20px; background:#fff; }
.cohort-page main summary { display:flex; justify-content:space-between; align-items:center; gap:16px; list-style:none; cursor:pointer; padding:18px 0; font-weight:700; font-size:16px; }
.cohort-page main summary::-webkit-details-marker { display:none; }
.cohort-page main summary::after { content:'⌄'; display:block; flex-shrink:0; transition:transform .2s; }
.cohort-page main details[open] > summary::after { transform:rotate(180deg); }
.cohort-page .cohort-timetable { padding-top:8px; }
.cohort-page .cohort-timetable p { border-top:1px solid #E7E5E0; padding-top:12px; }
.cohort-page .cohort-timetable strong:first-child { display:block; }
.cohort-page :is(.cohort-muted-box,.cohort-care,#worry) { background:#F7F7F5; padding:24px; border-radius:16px; margin-top:20px; }
.cohort-page #worry { border:0; margin-top:0; }
.cohort-page .cohort-muted-box ul { padding-left:20px; }
.cohort-page .fit-list li::before { content:none; }
.cohort-page .fit-list li { padding-left:0; }
.cohort-page .cohort-stats { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; padding:24px 0; border-block:1px solid #E7E5E0; margin:28px 0; }
.cohort-page .cohort-stats p { font-size:13px; margin:0; }
.cohort-page .cohort-stats strong { display:block; font-size:30px; line-height:1.4; letter-spacing:-.04em; }
.cohort-page .cohort-records { list-style:none; padding:0 0 0 22px; margin:0 0 24px; border-left:1px solid #E7E5E0; }
.cohort-page .cohort-records li { position:relative; padding:18px 0; border-bottom:1px solid #E7E5E0; }
.cohort-page .cohort-records li::before { content:''; position:absolute; left:-27px; top:26px; width:9px; height:9px; border-radius:50%; background:#6B6F6A; }
.cohort-page .cohort-records a { display:grid; grid-template-columns:1fr 96px; gap:20px; text-decoration:none; color:inherit; }
.cohort-page .cohort-records time { font-size:12px; color:#6B6F6A; }
.cohort-page .cohort-records h3 { font-size:18px; margin:4px 0 6px; }
.cohort-page .cohort-records p { font-size:14px; margin:0; }
.cohort-page .cohort-records img { width:96px; height:80px; object-fit:cover; border-radius:8px; }
.cohort-page .cohort-text-link { color:inherit; font-weight:700; text-underline-offset:5px; }
.cohort-page #review .cohort-grid { grid-template-columns:1fr; }
.cohort-page .cohort-quote cite { font-size:13px; color:#6B6F6A; font-style:normal; }
.cohort-page .cohort-output { padding:0; overflow:hidden; }
.cohort-page .cohort-output :is(img,video) { display:block; width:100%; height:auto; aspect-ratio:16/10; object-fit:contain; background:#F7F7F5; }
.cohort-page .cohort-output figcaption { padding:18px 22px; margin:0; }
.cohort-page .cohort-output h3 { color:#0B0B0A; margin:6px 0 0; }
.cohort-page .cohort-prep { display:grid; gap:12px; }
.cohort-page .cohort-care { border:1px solid #1F7A3A; }
.cohort-page .cohort-care h3 { color:#1F7A3A; }
.cohort-page .cohort-care p { margin:0; }
.cohort-page .profile-grid { display:grid; grid-template-columns:160px minmax(0,1fr); gap:28px; align-items:start; }
.cohort-page .profile-photo { width:160px; height:200px; object-fit:cover; border-radius:16px; filter:none; }
.cohort-page .profile-name { font-size:28px; font-weight:800; }
.cohort-page .profile-title { font-size:14px; }
.cohort-page .timeline { padding:0; list-style:none; }
.cohort-page .timeline li { display:block; padding:16px 0; border-bottom:1px solid #E7E5E0; }
.cohort-page .timeline h3 { font-size:17px; margin:5px 0; }
.cohort-page .timeline p,.cohort-page .period { font-size:13px; color:#6B6F6A; }
.cohort-page .timeline li::before { content:none; }
.cohort-page .cohort-faq { display:grid; gap:10px; }
.cohort-page .cohort-apply-steps { padding:0; list-style:none; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:16px; }
.cohort-page .cohort-apply-steps li { border-top:2px solid #E7E5E0; padding-top:16px; }
.cohort-page .cohort-apply-steps .step-num { position:static; display:block; background:none; color:#6B6F6A; font-size:13px; width:auto; height:auto; margin-bottom:10px; }
.cohort-page .cohort-apply-steps h3 { font-size:18px; }
.cohort-page .cohort-apply-steps p { font-size:14px; }
.cohort-page .cohort-bottom-bar { display:none; }
.cohort-page nav.header-bottom-bar { display:none; }
.cohort-page .cohort-enter { opacity:0; transform:translateY(12px); }
.cohort-page .cohort-reveal { transition:opacity .4s ease-out,transform .4s ease-out; }
@media (hover:hover) and (prefers-reduced-motion:no-preference) {
 .cohort-page :is(.cohort-button,.cohort-box,.cohort-output):hover { transform:translateY(-3px); }
}
@media (max-height:780px) { .cohort-page .cohort-card-included { display:none; } }
@media (max-width:1100px) { .cohort-page .cohort-layout { gap:32px; grid-template-columns:minmax(0,1fr) 340px; } }
@media (max-width:1023px) {
 .cohort-page .cohort-layout { display:flex; flex-direction:column; gap:56px; padding-block:40px 100px; }
 .cohort-page .cohort-card { position:static; width:100%; max-height:none; overflow:visible; }
 .cohort-page .cohort-content { width:100%; }
 .cohort-page .cohort-hero-grid,.cohort-page .cohort-worry-grid { gap:32px; }
 .cohort-page .cohort-hero-grid { grid-template-columns:1.35fr 1fr; }
 .cohort-page .cohort-hero figure img { height:420px; }
 .cohort-page .cohort-bottom-bar:not([hidden]) { position:fixed; inset:auto 0 0; display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px 24px calc(12px + env(safe-area-inset-bottom)); background:#fff; border-top:1px solid #E7E5E0; z-index:94; animation:cohort-bar-in .25s ease-out; }
 .cohort-page .cohort-bottom-bar > span { font-size:13px; }
 .cohort-page .site-footer { padding-bottom:calc(110px + env(safe-area-inset-bottom)); }
 .cohort-page .header-desktop-top { display:none; }
}
@media (max-width:700px) {
 .cohort-page .cohort-shell { width:calc(100% - 40px); }
 .cohort-page .cohort-hero { padding:40px 0; }
 .cohort-page .cohort-hero-grid,.cohort-page .cohort-worry-grid { grid-template-columns:1fr; }
 .cohort-page .cohort-hero figure img { height:330px; object-position:center 48%; }
 .cohort-page main h1 { font-size:31px; }
 .cohort-page main h2 { font-size:30px; }
 .cohort-page .cohort-worry { padding:44px 0; }
 .cohort-page .cohort-grid { grid-template-columns:1fr; }
 .cohort-page .cohort-section { margin-bottom:44px; padding-bottom:44px; }
 .cohort-page :is(.cohort-box,.cohort-part,.cohort-quote) { padding:20px; }
 .cohort-page .cohort-part-head { grid-template-columns:26px 1fr auto; gap:7px; }
 .cohort-page .cohort-part-head h3 { font-size:18px; }
 .cohort-page .cohort-card { padding:22px; }
 .cohort-page .cohort-stats { gap:8px; }
 .cohort-page .cohort-stats strong { font-size:25px; }
 .cohort-page .cohort-stats p { font-size:11px; }
 .cohort-page .profile-grid { grid-template-columns:1fr; }
 .cohort-page .cohort-apply-steps { grid-template-columns:1fr; }
 .cohort-page .cohort-bottom-bar:not([hidden]) { padding-inline:12px; gap:8px; }
 .cohort-page .cohort-bottom-bar > span { font-size:11px; }
 .cohort-page .cohort-bottom-bar .cohort-button { font-size:13px; padding-inline:12px; }
}
@keyframes cohort-bar-in { from { transform:translateY(100%); } to { transform:translateY(0); } }
@media (prefers-reduced-motion:reduce) {
 .cohort-page main *, .cohort-page main *::after { animation:none!important; transition:none!important; }
 .cohort-page .cohort-enter { opacity:1; transform:none; }
}
.cohort-page .pillar-num,.cohort-page .cohort-apply-steps .step-num { font-family:inherit; }
/* 코호트 상세 추가 (2026-09-26 2차): 수강평 출처 줄, 빌더 조쉬 인터뷰 영상 */
.cohort-page #review .cohort-small { font-size:13px; color:#6B6F6A; margin:-4px 0 18px; }
.cohort-page .cohort-video { margin:32px 0 0; }
.cohort-page .cohort-video-play { position:relative; display:block; aspect-ratio:16/9; border-radius:16px; overflow:hidden; border:1px solid #E7E5E0; background:#111; }
.cohort-page .cohort-video-play img,.cohort-page .cohort-video iframe { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; border:0; display:block; }
.cohort-page .cohort-video-icon { position:absolute; left:50%; top:50%; width:64px; height:64px; margin:-32px 0 0 -32px; border-radius:50%; background:#FFC71A; box-shadow:0 6px 20px rgba(0,0,0,.25); transition:transform .2s; }
.cohort-page .cohort-video-icon::after { content:""; position:absolute; left:26px; top:21px; border-left:17px solid #15251C; border-top:11px solid transparent; border-bottom:11px solid transparent; }
.cohort-page .cohort-video-play:hover .cohort-video-icon { transform:scale(1.06); }
.cohort-page .cohort-video-play:focus-visible { outline:3px solid #1F7A3A; outline-offset:3px; }
.cohort-page .cohort-video figcaption { margin-top:10px; font-size:14px; color:#6B6F6A; }
.cohort-page .cohort-video figcaption strong { color:#15251C; }
/* 코호트 상세 색 (2026-09-26 3차, 저자: 초록 대신 홈 「서비스」 영역처럼): 옐로 히어로 + #F7F7F5 바탕 + 옐로 알약 라벨 + 검정 버튼 */
body.cohort-page { background:#F7F7F5; }
.cohort-page .cohort-hero { background:#FFC71A; color:#111; }
.cohort-page .cohort-hero figcaption { color:#111; opacity:.72; }
.cohort-page .cohort-hero .cohort-badge { background:#111; color:#FFC71A; }
.cohort-page .cohort-facts > div { border-top-color:rgba(17,17,17,.2); }
.cohort-page .cohort-hero .cohort-primary { background:#111; color:#fff; border-color:#111; }
.cohort-page .cohort-hero .cohort-secondary { background:transparent; color:#111; border-color:#111; }
.cohort-page .cohort-worry { background:#fff; }
.cohort-page .cohort-worry .cohort-label { background:#FFC71A; }
.cohort-page .cohort-label { padding:8px 18px; border:0; border-radius:100px; background:#FFC71A; color:#111; font-size:14px; font-weight:800; letter-spacing:.02em; }
.cohort-page :is(.cohort-muted-box,.cohort-care,#worry) { background:#fff; border:1px solid #E7E5E0; }
.cohort-page .cohort-video-icon::after { border-left-color:#111; }
.cohort-page .cohort-video figcaption strong { color:#111; }
.cohort-page .cohort-terminal { background:#111; }
.cohort-page #community .cohort-small { margin-top:14px; font-size:13px; color:#6B6F6A; }
/* 빌드스쿨 히어로 제목 위계 (2026-09-26): 과정 이름이 메인, 「토요일 두 번이면」은 서브카피 */
.cohort-page main h1.cohort-title { font-size:clamp(52px,6.4vw,92px); line-height:1.02; font-weight:900; letter-spacing:-.05em; margin:22px 0 18px; }
.cohort-page .cohort-title-en { display:block; margin-bottom:12px; font-size:15px; line-height:1; font-weight:800; letter-spacing:.14em; text-transform:uppercase; }
.cohort-page .cohort-subcopy { font-size:clamp(20px,1.9vw,26px); line-height:1.4; font-weight:700; letter-spacing:-.03em; margin:0 0 16px; }
@media (max-width:760px) { .cohort-page main h1.cohort-title { font-size:52px; } .cohort-page .cohort-subcopy { font-size:20px; } }
/* ───────── 빌드스쿨 세련 스타일 (2026-09-26 4차, 저자: 그라데이션·버튼·텍스트 배치를 세련되게) ───────── */
.cohort-page .cohort-hero { position:relative; overflow:hidden; padding:84px 0 88px;
  background:
    radial-gradient(900px 520px at 88% -8%, rgba(255,255,255,.62), transparent 62%),
    radial-gradient(760px 520px at -6% 108%, rgba(198,242,60,.42), transparent 60%),
    radial-gradient(520px 420px at 58% 120%, rgba(255,140,0,.22), transparent 70%),
    linear-gradient(135deg,#FFE27A 0%,#FFC71A 46%,#FFB60F 100%); }
.cohort-page .cohort-hero::before { content:""; position:absolute; inset:0; pointer-events:none; opacity:.22; mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.5'/%3E%3C/svg%3E"); }
.cohort-page .cohort-hero > * { position:relative; }
.cohort-page .cohort-hero-grid { gap:72px; }
/* 뱃지: 유리 + 살아 있는 초록 점 */
.cohort-page .cohort-hero .cohort-badge.cohort-live { display:inline-flex; align-items:center; gap:8px; padding:7px 14px 7px 12px; background:rgba(255,255,255,.55); color:#111; border:1px solid rgba(255,255,255,.8); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); box-shadow:0 6px 20px -10px rgba(90,60,0,.35); font-size:13px; }
.cohort-page .cohort-live i { width:8px; height:8px; border-radius:50%; background:#1F9D3A; box-shadow:0 0 0 0 rgba(31,157,58,.5); animation:cohortPulse 2.2s ease-out infinite; }
@keyframes cohortPulse { 0%{box-shadow:0 0 0 0 rgba(31,157,58,.45)} 70%{box-shadow:0 0 0 9px rgba(31,157,58,0)} 100%{box-shadow:0 0 0 0 rgba(31,157,58,0)} }
/* 제목: 세리프 이탤릭 영문 + 굵은 한글 */
.cohort-page .cohort-title-en { font-family:'Instrument Serif',Georgia,serif; font-style:italic; font-weight:400; font-size:clamp(28px,2.6vw,40px); letter-spacing:-.01em; text-transform:none; margin-bottom:6px; opacity:.9; }
.cohort-page main h1.cohort-title { font-size:clamp(56px,6.6vw,96px); letter-spacing:-.06em; line-height:.98; margin-top:18px; }
.cohort-page .cohort-subcopy { position:relative; padding-left:18px; }
.cohort-page .cohort-subcopy::before { content:""; position:absolute; left:0; top:.28em; bottom:.28em; width:4px; border-radius:4px; background:#111; }
.cohort-page .cohort-hero-grid > div > p:not([class]) { max-width:560px; color:rgba(17,17,17,.78); }
/* 정보: 유리 타일 */
.cohort-page .cohort-hero .cohort-facts { grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
.cohort-page .cohort-hero .cohort-facts > div { border:1px solid rgba(255,255,255,.7); border-radius:14px; padding:12px 14px; background:rgba(255,255,255,.38); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); }
.cohort-page .cohort-hero .cohort-facts dt { font-size:11px; font-weight:700; letter-spacing:.04em; opacity:.6; }
/* 버튼: 알약 + 화살표 원 */
.cohort-page .cohort-button { border-radius:999px; min-height:52px; padding:12px 22px; transition:transform .2s ease-out, box-shadow .2s ease-out, background .2s; }
.cohort-page .cohort-hero .cohort-primary { gap:12px; padding-right:8px; box-shadow:0 14px 30px -14px rgba(0,0,0,.55); }
.cohort-page .cohort-arrow { display:inline-grid; place-items:center; width:36px; height:36px; border-radius:50%; background:#FFC71A; color:#111; font-weight:900; transition:transform .2s ease-out; }
.cohort-page .cohort-primary:hover .cohort-arrow { transform:translateX(3px); }
.cohort-page .cohort-button:hover { transform:translateY(-2px); }
.cohort-page .cohort-hero .cohort-secondary { background:rgba(255,255,255,.45); border-color:rgba(17,17,17,.18); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); }
/* 사진: 큰 라운드 + 떠 있는 그림자 + 유리 칩 */
.cohort-page .cohort-hero-visual { position:relative; }
.cohort-page .cohort-hero .cohort-hero-visual img { height:560px; border-radius:28px; object-fit:cover; box-shadow:0 40px 80px -30px rgba(90,55,0,.55), 0 0 0 1px rgba(255,255,255,.5); }
.cohort-page .cohort-hero-chip { position:absolute; left:-28px; bottom:56px; display:grid; gap:2px; padding:14px 18px; border-radius:16px; background:rgba(17,17,17,.78); color:#fff; backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px); box-shadow:0 20px 40px -18px rgba(0,0,0,.6); }
.cohort-page .cohort-hero-chip b { font-family:'Instrument Serif',Georgia,serif; font-style:italic; font-weight:400; font-size:22px; color:#FFC71A; letter-spacing:0; }
.cohort-page .cohort-hero-chip span { font-size:12px; opacity:.85; }
.cohort-page .cohort-hero figcaption { text-align:right; font-size:11px; }
/* 본문: 제목 위계·카드 깊이 */
.cohort-page main h2 { font-size:40px; font-weight:850; letter-spacing:-.045em; }
.cohort-page .cohort-label { display:inline-flex; align-items:center; gap:7px; }
.cohort-page .cohort-label::before { content:""; width:6px; height:6px; border-radius:50%; background:#111; }
.cohort-page :is(.cohort-box,.cohort-quote,.cohort-output,.cohort-part) { border-color:#ECEAE4; border-radius:20px; box-shadow:0 1px 0 rgba(17,17,17,.03); transition:transform .25s ease-out, box-shadow .25s ease-out; }
.cohort-page :is(.cohort-box,.cohort-quote,.cohort-output):hover { transform:translateY(-3px); box-shadow:0 22px 40px -26px rgba(17,17,17,.35); }
.cohort-page .pillar-num { display:inline-grid; place-items:center; min-width:30px; height:30px; padding:0 8px; border-radius:999px; background:#111; color:#FFC71A; font-size:12px; font-weight:800; letter-spacing:0; }
/* 신청 카드: 그라데이션 테두리 + 큰 가격 */
.cohort-page .cohort-card { border-radius:22px; border:1px solid transparent; background:linear-gradient(#fff,#fff) padding-box, linear-gradient(135deg,#FFC71A,#C6F23C 55%,#4CC764) border-box; box-shadow:0 30px 60px -36px rgba(17,17,17,.4); }
.cohort-page .cohort-price { font-size:46px; font-weight:900; letter-spacing:-.04em; }
.cohort-page .cohort-card .cohort-primary { background:linear-gradient(135deg,#111 0%,#2A2A2A 100%); color:#fff; border-color:#111; }
.cohort-page .cohort-card .cohort-primary:hover { box-shadow:0 14px 28px -14px rgba(0,0,0,.6); }
/* 모바일 하단 바: 어두운 유리 */
.cohort-page .cohort-bottom-bar:not([hidden]) { background:rgba(17,17,17,.88); color:#fff; border-top:0; backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); }
.cohort-page .cohort-bottom-bar .cohort-primary { background:#FFC71A; color:#111; border-color:#FFC71A; }
@media (max-width:1023px) { .cohort-page .cohort-hero .cohort-facts { grid-template-columns:1fr 1fr; } .cohort-page .cohort-hero .cohort-hero-visual img { height:460px; } .cohort-page .cohort-hero-chip { left:16px; bottom:40px; } }
@media (max-width:760px) { .cohort-page .cohort-hero { padding:48px 0 56px; } .cohort-page .cohort-hero .cohort-hero-visual img { height:380px; border-radius:22px; } .cohort-page main h2 { font-size:30px; } .cohort-page .cohort-price { font-size:40px; } }
@media (prefers-reduced-motion:reduce) { .cohort-page .cohort-live i { animation:none; } }
/* 빌드스쿨 히어로 순서: 제목 → 서브카피 → 설명 → 버튼 → 정보 타일 → 안심 문구 (버튼을 첫 화면 안으로) */
.cohort-page .cohort-hero { padding:60px 0 72px; }
.cohort-page .cohort-hero-grid > div:first-child { display:flex; flex-direction:column; align-items:flex-start; }
.cohort-page .cohort-hero .cohort-actions { order:1; margin:6px 0 0; }
.cohort-page .cohort-hero .cohort-facts { order:2; width:100%; margin:28px 0 14px; }
.cohort-page .cohort-hero .cohort-assurance { order:3; margin:0; }
.cohort-page main h1.cohort-title { font-size:clamp(56px,6.2vw,90px); }
.cohort-page .cohort-hero-grid > div > p:not([class]) { margin-bottom:14px; }
.cohort-page #web-os .cohort-small { margin-top:14px; font-size:13px; color:#6B6F6A; }
/* 빌드스쿨 2차·3차 모듈 목록 (2026-09-26 커리큘럼 v2) */
.cohort-page .cohort-modules { list-style:none; margin:14px 0 16px; padding:0; display:grid; gap:8px; }
.cohort-page .cohort-modules li { display:grid; grid-template-columns:minmax(0,210px) 1fr; gap:14px; align-items:baseline; padding:11px 14px; border-radius:12px; background:#F7F7F5; font-size:15px; line-height:1.55; }
.cohort-page .cohort-modules li strong { font-weight:800; }
.cohort-page .cohort-parts + .cohort-small { margin-top:14px; font-size:13px; color:#6B6F6A; }
@media (max-width:760px) { .cohort-page .cohort-modules li { grid-template-columns:1fr; gap:2px; } }

/* 서브 페이지 세련 스타일 (2026-09-26) — .refined-page */
body.refined-page {
  --page-bg:#F7F7F5; --offwhite:#F7F7F5; --text:#111; --muted:#6B6F6A;
  --yellow:#FFC71A; --green:#1F7A3A;
  background:#F7F7F5; color:#111;
}
.refined-page :is(.sub-brand-art,.sub-ribbon,.sticker,.section-sticker,.sub-decor,.sub-dots,.header-menu-sticker),
.refined-page .record-work > img { display:none!important; }
/* 실제 문구는 감추지 않고 읽을 수 있는 제목 크기로 낮춘다. */
.refined-page :is(.giant-display,.vision-display) { position:static; font-size:clamp(28px,4vw,48px); line-height:1.2; letter-spacing:-.045em; color:inherit; margin:0 0 28px; }
.refined-page :is(.giant-display,.vision-display)[aria-hidden="true"] { display:none; }
.refined-page :is(.case-hero,.page-head,main > .hero,.refined-record-hero) {
  position:relative; isolation:isolate; overflow:hidden; color:#111; --text:#111; --muted:#494225;
  background:radial-gradient(900px 520px at 88% -8%,#ffffff9e,transparent 62%),radial-gradient(760px 520px at -6% 108%,#c6f23c6b,transparent 60%),radial-gradient(520px 420px at 58% 120%,#ff8c0038,transparent 70%),linear-gradient(135deg,#FFE27A,#FFC71A 46%,#FFB60F);
}
.refined-page :is(.case-hero,.page-head,main > .hero,.refined-record-hero)::before {
  content:""; position:absolute; inset:0; z-index:-1; pointer-events:none; opacity:.22; mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.5'/%3E%3C/svg%3E");
}
.refined-page [data-eyebrow]::before {
  content:attr(data-eyebrow); display:block; margin-bottom:18px;
  font:italic 400 clamp(28px,2.6vw,40px)/1.15 'Instrument Serif',Georgia,serif; letter-spacing:-.01em; color:#111;
}
.refined-page .refined-eyebrow { width:min(1120px,calc(100% - 48px)); margin-inline:auto; }
.refined-page .page-head { padding-block:72px 64px; }
.refined-page .case-hero { padding-block:60px 72px; }
.refined-page :is(.page-head,.case-hero) h1 { font-size:clamp(40px,5.8vw,84px); font-weight:900; letter-spacing:-.06em; line-height:1.12; }
.refined-page main h2 { font-size:clamp(28px,3.2vw,40px); font-weight:850; letter-spacing:-.045em; line-height:1.3; }
.refined-page :is(.section-alt,.blueprint-surface,.vision-section) { background:#F7F7F5; color:#111; }
.refined-page :is(.section-dark,.site-dark,.statement,.mission,.claude-os) {
  background:radial-gradient(ellipse at 85% 0,rgba(255,199,26,.065),transparent 60%),#111;
  color:#fff; --text:#fff; --muted:#B6B6AF; --green:#FFC71A;
}
.refined-page :is(.section-dark,.site-dark,.statement,.mission,.claude-os) :is(em,.stat-num,.metric-num,.yes) { color:#FFC71A; }
.refined-page :is(.eyebrow,.kicker,.section-label,.card-label) {
  display:inline-flex; align-items:center; gap:7px; padding:7px 13px; border-radius:999px;
  background:#FFC71A; color:#111!important; font-size:14px; font-weight:800; line-height:1.35; letter-spacing:0; text-shadow:none;
}
.refined-page :is(.eyebrow,.kicker,.section-label,.card-label)::before { content:""; flex:0 0 6px; width:6px; height:6px; border-radius:50%; background:#111; }
.refined-page :is(.card,.pain-card,.case-card,.course-card,.quote-card,.principle-card,.record-work,.record-lecture,.price-card,.builds .b,.gallery figure,.review) {
  border:1px solid #ECEAE4; border-radius:20px; background:#fff; color:#111; --text:#111; --muted:#6B6F6A; --faint:#6B6F6A;
  box-shadow:0 1px 0 #11111108; transition:transform .25s ease-out,box-shadow .25s ease-out;
}
.refined-page .record-work { padding-bottom:30px; min-height:280px; }
/* 흰 카드로 바뀐 요금 카드: 원래 검정 카드용 흰 글자색(rgba 255)이 남아 안 보이던 문제 */
.refined-page .price-card :is(.price-note,.price small) { color:#6B6F6A; }
.refined-page .price-card ul { border-top-color:#ECEAE4; }
.refined-page .price-card ul li { color:#111; }
.refined-page :is(.record-work,.record-lecture,.quote-card,.course-card,.card) p { color:inherit; }
.refined-page :is(.step-num,.pillar-num,.record-count,.badge,.disc-badge,.principle-card > span) { display:inline-grid; place-items:center; padding:6px 12px; border-radius:999px; background:#111; color:#FFC71A; font-size:14px; font-weight:800; line-height:1.4; vertical-align:middle; }
.refined-page :is(.btn,.btn-cta,.btn-ghost,.card-cta,.sticky .go,.record-filters button) { border-radius:999px; transition:transform .2s ease-out,box-shadow .2s ease-out; animation:none; }
.refined-page :is(.btn-primary,.btn-dark,.btn-cta,.card-cta,.sticky .go) {
  background:#111; color:#fff; border-color:#111; display:inline-flex; align-items:center; justify-content:center; gap:12px; padding:10px 10px 10px 22px;
}
.refined-page :is(.btn-primary,.btn-dark,.btn-cta,.card-cta,.sticky .go)::after { content:"→"; display:inline-grid; place-items:center; flex:0 0 34px; width:34px; height:34px; border-radius:50%; background:#FFC71A; color:#111; font-size:19px; line-height:1; }
.refined-page .btn-ghost { background:#fff; color:#111; border:1px solid #ECEAE4; }
.refined-page :is(.case-hero,.page-head,.hero) :is(.eyebrow,.btn-ghost,.pill,.tools b,.hero-badge) {
  background:rgba(255,255,255,.45); border:1px solid rgba(255,255,255,.7); color:#111!important;
  backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); border-radius:999px;
}
.refined-page :is(.case-hero-media,.profile-photo,.feature-photo,.photo-gallery,.record-photos,.record-lecture,.gallery) img { border-radius:18px; }
.refined-page :is(.marquee-row,.marquee-track) { animation:none; transform:none; }
.refined-page .marquee-row { overflow:visible; }
.refined-page .marquee-track { flex-wrap:wrap; width:auto; }
.refined-page .marquee-track[aria-hidden="true"] { display:none; }
.refined-page .refined-record-hero { border-radius:24px; padding:40px; margin-bottom:40px; }
.refined-page .record-summary { background:#fff; color:#111; border:1px solid #ECEAE4; border-radius:20px; }
/* 광고 랜딩은 기존 CTA 영역과 순서를 유지한다. */
.refined-page.course-landing { --bg-soft:#fff; --faint:#6B6F6A; --line:#ECEAE4; --orange:#925400; }
.refined-page.course-landing .hero h1 { font-size:clamp(32px,5vw,58px); font-weight:900; letter-spacing:-.055em; text-shadow:none; color:#111; }
.refined-page.course-landing .hero .hl { color:#111; }
.refined-page.course-landing .card-body h2 { font-size:1.12rem; letter-spacing:-.02em; }
.refined-page.course-landing :is(.sec > h3,.final > h3) { font-size:clamp(28px,3.2vw,40px); font-weight:850; letter-spacing:-.045em; }
.refined-page.course-landing :is(.band,.final,.sticky) { background:#111; color:#fff; --muted:#B6B6AF; --faint:#B6B6AF; }
.refined-page.course-landing :is(.band,.final) { background:radial-gradient(ellipse at 85% 0,#ffc71a10,transparent 60%),#111; }
.refined-page.course-landing .btn-cta { display:flex; }
.refined-page.course-landing :is(.stats .big,.stats .star,.price .pct) { color:#111; }
.refined-page.course-landing .caret { display:none; }
.refined-page :is(.case-hero,.page-head) { border:0; border-image:none; }
.refined-page .case-card { padding:28px; margin-bottom:16px; }
.refined-page .about-vision-sticker { display:none; }
.refined-page.course-landing :is(.pipe .node,.curri .grp,.persona li,.author,.author-metrics .m,.bundle,.faq details) { background:#fff; color:#111; --text:#111; --muted:#6B6F6A; --faint:#6B6F6A; border:1px solid #ECEAE4; border-radius:20px; }
.refined-page.course-landing :is(.persona b,.author-metrics .m b,.bundle .total,.review .rs,.reviews-more a,.faq summary::after,.compare .head .ours) { color:#111; }
.refined-page.course-landing :is(.pipe .node .h .n,.curri .grp .h .n) { padding:4px 9px; border:0; border-radius:999px; background:#111; color:#FFC71A; }
.refined-page.course-landing .pricebox { background:#111; color:#fff; --faint:#B6B6AF; border-radius:20px; }
.refined-page.course-landing .pricebox :is(.tag,.note b) { color:#FFC71A; }
.refined-page.course-landing .card-cta { display:flex; width:100%; }
.refined-page.course-landing .sticky a.go { background:#111; color:#fff; border:1px solid #444; border-radius:999px; }
@media (hover:hover) and (prefers-reduced-motion:no-preference) {
  .refined-page :is(.card,.pain-card,.case-card,.course-card,.quote-card,.principle-card,.record-work,.record-lecture,.price-card,.builds .b,.gallery figure,.review):hover { transform:translateY(-3px); box-shadow:0 22px 40px -26px #11111159; }
  .refined-page :is(.btn,.btn-cta,.btn-ghost,.sticky .go):hover { transform:translateY(-3px); box-shadow:0 14px 28px -18px #11111166; }
}
@media (max-width:760px) {
  .refined-page .page-head { padding-block:48px; }
  .refined-page .case-hero { padding-block:40px 48px; }
  .refined-page .refined-record-hero { padding:24px; border-radius:20px; }
  .refined-page .record-detail h1 { font-size:30px; }
  .refined-page .refined-eyebrow { width:calc(100% - 40px); }
  .refined-page .sticky .go { gap:7px; padding:8px 8px 8px 14px; }
}
@media (prefers-reduced-motion:reduce) {
  .refined-page *, .refined-page *::before, .refined-page *::after { animation:none!important; transition:none!important; scroll-behavior:auto!important; }
}
/* 서브 페이지 세련 스타일 보정 (2026-09-26 검수): 글꼴을 빌드스쿨과 같게, 공사장 사선 띠 제거 */
.refined-page main :is(h1,h2,h3,h4) { font-family:"Pretendard",-apple-system,BlinkMacSystemFont,sans-serif; letter-spacing:-.04em; }
.refined-page main h1 { font-weight:900; }
.refined-page main h2 { font-weight:850; }
.refined-page main :is(.eyebrow,.kicker,.section-label,.label) { font-family:"Pretendard",-apple-system,sans-serif; letter-spacing:.02em; }
.refined-page .record-detail h1 { font-size:clamp(30px,3.4vw,46px); line-height:1.25; }
.refined-page :is(.hero,.case-hero,.page-head,.cta-banner) { border-image:none; border-bottom:0; }
.refined-page .cta-banner { background:#111; color:#fff; border-radius:0; position:relative; overflow:hidden; }
.refined-page .cta-banner::before { content:""; position:absolute; inset:0; pointer-events:none; background:radial-gradient(700px 360px at 85% 0%, rgba(255,199,26,.28), transparent 65%); }
.refined-page .cta-banner > * { position:relative; }
.refined-page .stripe { display:none; }
.refined-page.course-landing main :is(h1,h2,h3,h4), .refined-page.course-landing :is(.sec,.final,.card-body) :is(h2,h3) { font-family:"Pretendard",-apple-system,BlinkMacSystemFont,sans-serif; }
/* 빌드스쿨 1기 가격 단계 (2026-09-26 확정: 얼리버드 45만 ~10/11 → 정가 50만, 인프런 수강생 40만) */
.cohort-page .cohort-price-tag { display:inline-block; margin:6px 0 2px; padding:4px 10px; border-radius:999px; background:#111; color:#FFC71A; font-size:12px; font-weight:800; }
.cohort-page .cohort-price s { font-size:15px; font-weight:600; color:#8A8C86; margin-left:6px; letter-spacing:0; }
.cohort-page .cohort-price-steps { list-style:none; margin:8px 0 12px; padding:0; display:grid; gap:6px; }
.cohort-page .cohort-price-steps li { display:grid; grid-template-columns:64px 1fr auto; align-items:center; gap:8px; padding:8px 12px; border-radius:12px; border:1px solid #ECEAE4; color:#8A8C86; font-size:13px; }
.cohort-page .cohort-price-steps li b { color:inherit; font-weight:800; }
.cohort-page .cohort-price-steps li span { font-weight:800; }
.cohort-page .cohort-price-steps li.is-now { border-color:#111; background:#FFF8DC; color:#111; }
.cohort-page .cohort-price-inflearn { margin:0 0 10px; padding:9px 12px; border-radius:12px; background:#F7F7F5; font-size:13px; }
.cohort-page .cohort-price-inflearn small { color:#6B6F6A; }

/* 자료실 (2026-09-28, tools/build_resources.py) */
.resource-cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:22px}
.resource-thumbs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:22px}
.resource-thumbs img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;border-radius:12px;border:1px solid #ddd;background:#eee}
.resource-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;list-style:none;padding:0;margin:0 0 18px}
.resource-stats li{background:#fff;border:1px solid #ddd;border-radius:16px;padding:18px;color:#555;font-size:14px}
.resource-stats b{display:block;font-size:34px;line-height:1.15;color:#111}
.resource-table{width:100%;border-collapse:collapse;background:#fff;border:1px solid #ddd;border-radius:16px;overflow:hidden;margin-bottom:14px}
.resource-table caption{text-align:left;font-weight:700;padding:0 0 8px}
.resource-table th,.resource-table td{text-align:left;padding:12px 16px;border-bottom:1px solid #eee;vertical-align:top}
.resource-table th{white-space:nowrap;width:120px}
.resource-steps{display:grid;gap:12px;padding-left:22px}
.resource-steps li{background:#fff;border:1px solid #ddd;border-radius:16px;padding:16px 18px}
.resource-steps b{display:block;margin-bottom:4px}
.resource-terms{padding-left:20px}
.resource-follow{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;list-style:none;padding:0}
.resource-follow a{display:block;background:#fff;border:1px solid #ddd;border-radius:16px;padding:16px;color:#111;text-decoration:none}
.resource-follow span{display:block;color:#666;font-size:13px;margin-top:4px}
.resource-follow a:hover,.resource-thumbs a:hover img{border-color:#111}
.page-resources code,.resource-steps code{word-break:break-all}
@media(max-width:760px){.resource-thumbs,.resource-follow{grid-template-columns:repeat(2,minmax(0,1fr))}.resource-stats{grid-template-columns:1fr}.resource-table th{width:auto;white-space:normal}}
