/* Extracted from program.html — page-specific styles */
/* ── HERO ─────────────────────────────────────────────────────── */
.pg-hero {
  background: var(--gradient-hero);
  padding: calc(var(--space-24) + 40px) 0 var(--space-16);
  text-align: center; position: relative; overflow: hidden;
}
.pg-hero::before {
  content: ''; position: absolute; inset: 0; pointer-events: none;
  background:
    radial-gradient(ellipse 55% 70% at 8% 50%, rgba(33,96,181,0.06) 0%, transparent 60%),
    radial-gradient(ellipse 45% 60% at 92% 35%, rgba(14,165,233,0.05) 0%, transparent 55%);
}
.pg-hero__kr-bg {
  position: absolute; left: -10px; top: 50%; transform: translateY(-50%);
  font-family: var(--font-kr); font-size: clamp(90px,14vw,190px);
  font-weight: 700; color: rgba(33,96,181,0.04);
  line-height: 1; pointer-events: none; user-select: none; white-space: nowrap;
}
.pg-hero__inner { position: relative; z-index: 2; max-width: 860px; margin: 0 auto; padding: 0 var(--space-6); }

/* Partnership badge */
.pg-partner-badge {
  display: inline-flex; align-items: center; gap: var(--space-3);
  background: transparent; border: 1px solid rgba(33,96,181,0.15);
  border-radius: var(--radius-md); padding: 10px 20px;
  margin-bottom: var(--space-6); box-shadow: 0 2px 8px rgba(15,39,68,0.05);
}
.pg-partner-badge__divider { width: 1px; height: 24px; background: rgba(33,96,181,0.15); }
.pg-partner-badge span { font-size: var(--text-sm); font-weight: var(--weight-bold); color: var(--navy); }
.pg-partner-badge .kosme { color: var(--brand); }
.pg-partner-badge .x { color: var(--gray); font-weight: var(--weight-normal); }

.pg-hero__title {
  font-family: var(--font-display);
  font-size: clamp(2.6rem, 5.5vw, 4.5rem);
  font-weight: 700; color: var(--navy);
  line-height: 1.08; margin-bottom: var(--space-5); letter-spacing: -0.02em;
}
.pg-hero__title span {
  background: var(--gradient-brand);
  -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text;
}
.pg-hero__sub {
  font-size: var(--text-lg); color: var(--gray);
  max-width: 600px; margin: 0 auto var(--space-8); line-height: 1.7;
}

/* Quick fact pills row */
.pg-hero__facts {
  display: flex; justify-content: center; flex-wrap: wrap;
  gap: var(--space-3); margin-bottom: var(--space-8);
}
.pg-fact {
  display: flex; align-items: center; gap: 8px;
  background: #fff; border: 1px solid var(--color-border);
  border-radius: 999px; padding: 8px 18px;
  font-size: var(--text-sm); font-weight: var(--weight-semibold); color: var(--navy);
  box-shadow: 0 2px 8px rgba(15,39,68,0.05);
}
.pg-fact svg { width: 15px; height: 15px; fill: var(--brand); flex-shrink: 0; }
.pg-hero .breadcrumb a { color: var(--gray); text-decoration: none; }
.pg-hero .breadcrumb span { color: var(--navy); }

/* ── PROGRAM OVERVIEW BAND ─────────────────────────────────── */
.pg-overview-band {
  background: var(--navy); padding: var(--space-12) 0; position: relative; overflow: hidden;
}
.pg-overview-band::before {
  content: ''; position: absolute; inset: 0; pointer-events: none;
  background: radial-gradient(ellipse 70% 100% at 50% 50%, rgba(33,96,181,0.15) 0%, transparent 70%);
}
.pg-overview-band .container { position: relative; z-index: 1; }
.pg-overview-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: var(--space-6); }
@media (min-width: 768px) { .pg-overview-grid { grid-template-columns: repeat(4,1fr); } }
.pg-overview-item { text-align: center; }
.pg-overview-item strong {
  display: block; font-family: var(--font-display);
  font-size: clamp(2rem, 4vw, 3rem); color: #fff; line-height: 1; margin-bottom: 6px;
}
.pg-overview-item span { font-size: var(--text-sm); color: rgba(255,255,255,0.55); font-weight: var(--weight-medium); }
.pg-overview-divider { width: 1px; background: rgba(255,255,255,0.08); display: none; }
@media (min-width: 768px) { .pg-overview-divider { display: block; } }

/* ── COLLAB SECTION ─────────────────────────────────────────── */
.pg-collab-grid { display: grid; grid-template-columns: 1fr; gap: var(--space-10); align-items: center; }
@media (min-width: 1024px) { .pg-collab-grid { grid-template-columns: 1fr 1fr; } }
.pg-collab-img { border-radius: var(--radius-lg); overflow: hidden; }
.pg-collab-img img { width: 100%; display: block; border-radius: var(--radius-lg); box-shadow: var(--shadow-lg); }
.pg-collab-text h2 {
  font-family: var(--font-display);
  font-size: clamp(1.9rem, 3.5vw, 3rem); color: var(--navy);
  margin-bottom: var(--space-5); line-height: 1.15;
}
.pg-collab-text p { font-size: var(--text-md); color: var(--color-text-secondary); line-height: 1.75; margin-bottom: var(--space-5); }
.pg-collab-cards { display: grid; grid-template-columns: repeat(2,1fr); gap: var(--space-4); margin-top: var(--space-6); }
.pg-collab-card { background: var(--cream); border: 1px solid var(--color-border); border-radius: var(--radius-md); padding: var(--space-5); }
.pg-collab-card svg { width: 24px; height: 24px; margin-bottom: var(--space-3); stroke: var(--brand); fill: none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.pg-collab-card h3 { font-size: var(--text-base); font-weight: var(--weight-bold); color: var(--navy); margin-bottom: 4px; }
.pg-collab-card p { font-size: var(--text-sm); color: var(--gray); line-height: 1.6; margin: 0; }

/* ── GLOBAL: Tighter section spacing on program page ────────── */
#about-program, #modules, #highlights, #who-join { padding: 64px 0; }

/* ── MODULES GRID ───────────────────────────────────────────── */
.pg-modules-grid { display: grid; grid-template-columns: 1fr; gap: var(--space-6); align-items: stretch; }
@media (min-width: 768px) { .pg-modules-grid { grid-template-columns: repeat(2,1fr); } }
@media (min-width: 1024px) { .pg-modules-grid { grid-template-columns: repeat(3,1fr); } }
.pg-module-card {
  background: #fff; border: 1px solid var(--color-border);
  border-radius: var(--radius-lg); padding: 40px 28px 24px;
  position: relative; overflow: visible;
  transition: all 0.3s ease; margin-top: 12px;
}
.pg-module-card::before {
  content: ''; position: absolute; top: 0; left: 0; right: 0;
  height: 5px; border-radius: var(--radius-lg) var(--radius-lg) 0 0;
}
.pg-module-card::after {
  content: ''; position: absolute; top: 0; left: 0; bottom: 0;
  width: 0; transition: width 0.3s ease; opacity: 0.04;
  border-radius: var(--radius-lg); pointer-events: none;
}
/* 3 color groups: 01&02=blue, 03&04=teal, 05&06=purple */
.pg-module-card:nth-child(1)::before, .pg-module-card:nth-child(2)::before { background: var(--brand); }
.pg-module-card:nth-child(3)::before, .pg-module-card:nth-child(4)::before { background: var(--teal); }
.pg-module-card:nth-child(5)::before, .pg-module-card:nth-child(6)::before { background: var(--purple); }
.pg-module-card:nth-child(1)::after, .pg-module-card:nth-child(2)::after { background: var(--brand); }
.pg-module-card:nth-child(3)::after, .pg-module-card:nth-child(4)::after { background: var(--teal); }
.pg-module-card:nth-child(5)::after, .pg-module-card:nth-child(6)::after { background: var(--purple); }
.pg-module-card:hover { box-shadow: 0 16px 40px rgba(15,39,68,0.1); transform: translateY(-6px); border-color: var(--color-primary-light); }
.pg-module-card:hover::after { width: 100%; }
/* Badge sits OUTSIDE card at top-left */
.pg-module-num {
  position: absolute; top: -12px; left: 20px; z-index: 2;
  display: inline-block; font-size: 11px; font-weight: var(--weight-bold);
  letter-spacing: 0.12em;
  padding: 5px 14px; border-radius: 999px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.06);
}
.pg-module-card:nth-child(1) .pg-module-num, .pg-module-card:nth-child(2) .pg-module-num { background: var(--brand); color: #fff; }
.pg-module-card:nth-child(3) .pg-module-num, .pg-module-card:nth-child(4) .pg-module-num { background: var(--teal); color: #fff; }
.pg-module-card:nth-child(5) .pg-module-num, .pg-module-card:nth-child(6) .pg-module-num { background: var(--purple); color: #fff; }
.pg-module-icon { width: 52px; height: 52px; background: var(--brand-wash); border-radius: var(--radius-md); display: flex; align-items: center; justify-content: center; margin-bottom: var(--space-4); }
.pg-module-icon svg { width: 26px; height: 26px; stroke: var(--brand); fill: none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
/* Icon colors match 3-group scheme */
.pg-module-card:nth-child(1) .pg-module-icon, .pg-module-card:nth-child(2) .pg-module-icon { background: var(--brand-wash); }
.pg-module-card:nth-child(1) .pg-module-icon svg, .pg-module-card:nth-child(2) .pg-module-icon svg { stroke: var(--brand); }
.pg-module-card:nth-child(3) .pg-module-icon, .pg-module-card:nth-child(4) .pg-module-icon { background: rgba(13,148,136,0.1); }
.pg-module-card:nth-child(3) .pg-module-icon svg, .pg-module-card:nth-child(4) .pg-module-icon svg { stroke: var(--teal); }
.pg-module-card:nth-child(5) .pg-module-icon, .pg-module-card:nth-child(6) .pg-module-icon { background: rgba(124,58,237,0.1); }
.pg-module-card:nth-child(5) .pg-module-icon svg, .pg-module-card:nth-child(6) .pg-module-icon svg { stroke: var(--purple); }
/* Font contrast: title 18px bold, body 14px regular */
.pg-module-card h3 { font-size: 18px; font-weight: var(--weight-bold); color: var(--navy); margin-bottom: var(--space-3); }
.pg-module-card p { font-size: 14px; color: var(--color-text-secondary); line-height: 1.7; margin: 0; }

/* ── HIGHLIGHTS ─────────────────────────────────────────────── */
.pg-highlights-grid { display: grid; grid-template-columns: 1fr; gap: var(--space-5); align-items: stretch; }
@media (min-width: 768px) { .pg-highlights-grid { grid-template-columns: repeat(2,1fr); } }
@media (min-width: 1024px) { .pg-highlights-grid { grid-template-columns: repeat(3,1fr); } }
.pg-hl-card {
  background: #fff; border: 1px solid var(--color-border);
  border-left: 3px solid var(--teal);
  border-radius: var(--radius-lg); padding: 24px 28px;
  display: flex; align-items: flex-start; gap: var(--space-4);
  transition: all 0.25s;
}
.pg-hl-card:hover { box-shadow: var(--shadow-md); border-color: var(--color-primary-light); border-left-color: var(--teal); transform: translateY(-3px); }
.pg-hl-check { width: 36px; height: 36px; min-width: 36px; flex-shrink: 0; background: var(--teal); border-radius: 50%; display: flex; align-items: center; justify-content: center; }
.pg-hl-check svg { width: 18px; height: 18px; fill: white; }
.pg-hl-card p { font-size: var(--text-base); color: var(--color-text); line-height: 1.6; margin: 0; }
.pg-hl-card p strong { color: var(--navy); font-weight: var(--weight-semibold); }

/* ── WHO SHOULD JOIN ────────────────────────────────────────── */
.pg-who-grid { display: grid; grid-template-columns: 1fr; gap: var(--space-6); align-items: stretch; }
@media (min-width: 640px) { .pg-who-grid { grid-template-columns: repeat(2,1fr); } }
@media (min-width: 1024px) { .pg-who-grid { grid-template-columns: repeat(4,1fr); } }
.pg-who-card {
  background: #fff; border: 1px solid var(--color-border);
  border-radius: var(--radius-lg); padding: 32px 24px 24px;
  text-align: center; transition: all 0.3s ease;
  position: relative;
}
.pg-who-card::before {
  content: ''; position: absolute; top: 0; left: 0; right: 0; height: 4px;
  border-radius: var(--radius-lg) var(--radius-lg) 0 0;
}
.pg-who-card:nth-child(1)::before { background: var(--brand); }
.pg-who-card:nth-child(2)::before { background: var(--teal); }
.pg-who-card:nth-child(3)::before { background: var(--purple); }
.pg-who-card:nth-child(4)::before { background: var(--coral); }
.pg-who-card:hover { box-shadow: 0 16px 40px rgba(15,39,68,0.1); transform: translateY(-6px); border-color: var(--color-primary-light); }
.pg-who-icon { width: 64px; height: 64px; border-radius: 50%; display: flex; align-items: center; justify-content: center; margin: 0 auto var(--space-5); }
.pg-who-card:nth-child(1) .pg-who-icon { background: var(--brand-wash); }
.pg-who-card:nth-child(1) .pg-who-icon svg { stroke: var(--brand); }
.pg-who-card:nth-child(2) .pg-who-icon { background: rgba(13,148,136,0.1); }
.pg-who-card:nth-child(2) .pg-who-icon svg { stroke: var(--teal); }
.pg-who-card:nth-child(3) .pg-who-icon { background: rgba(124,58,237,0.1); }
.pg-who-card:nth-child(3) .pg-who-icon svg { stroke: var(--purple); }
.pg-who-card:nth-child(4) .pg-who-icon { background: rgba(244,63,94,0.1); }
.pg-who-card:nth-child(4) .pg-who-icon svg { stroke: var(--coral); }
.pg-who-icon svg { width: 30px; height: 30px; fill: none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.pg-who-card h3 { font-size: var(--text-md); font-weight: var(--weight-bold); color: var(--navy); margin-bottom: var(--space-3); }
.pg-who-card p { font-size: var(--text-sm); color: var(--color-text-secondary); line-height: 1.7; margin: 0; }

/* ── MOBILE RESPONSIVE ────────────────────────────────────── */
@media (max-width: 767px) {
  .pg-modules-grid { grid-template-columns: repeat(2, 1fr); gap: var(--space-3); }
  .pg-module-card { padding: 20px 16px 16px; border-radius: var(--radius-md); }
  .pg-module-card h3 { font-size: var(--text-sm); }
  .pg-module-card p { font-size: var(--text-xs); line-height: 1.5; }
  .pg-module-icon { width: 40px; height: 40px; margin-bottom: var(--space-3); }
  .pg-module-icon svg { width: 20px; height: 20px; }
  .pg-module-num { font-size: 9px; padding: 4px 10px; top: -10px; left: 12px; }
  .pg-highlights-grid { grid-template-columns: repeat(2, 1fr); gap: var(--space-3); }
  .pg-hl-card { padding: var(--space-4); gap: var(--space-3); border-radius: var(--radius-md); }
  .pg-hl-check { width: 28px; height: 28px; min-width: 28px; }
  .pg-hl-check svg { width: 14px; height: 14px; }
  .pg-hl-card p { font-size: var(--text-sm); }
  .pg-who-card { padding: 24px 16px 16px; border-radius: var(--radius-md); }
  .pg-who-card h3 { font-size: var(--text-sm); }
  .pg-who-card p { font-size: var(--text-xs); }
  .pg-who-icon { width: 44px; height: 44px; margin-bottom: var(--space-3); }
  #about-program, #modules, #highlights, #who-join { padding: 48px 0; }
}
@media (max-width: 320px) {
  .pg-modules-grid, .pg-highlights-grid { grid-template-columns: 1fr; }
}
