/* YSM Career Tracks — Learn pages */

/* Header — share style, no overrides needed */

/* HERO */
.learn-hero {
  padding: clamp(28px, 4vw, 56px) 0 clamp(40px, 5vw, 64px);
  position: relative; overflow: hidden;
}
.learn-hero::before {
  content: ""; position: absolute;
  inset: -200px -10% auto auto;
  width: 720px; height: 720px;
  background: radial-gradient(closest-side, oklch(0.48 0.20 255 / 0.10), transparent 70%);
  z-index: 0;
}
.learn-hero__inner { position: relative; z-index: 1; }
.learn-hero h1 {
  font-size: clamp(38px, 5.5vw, 84px);
  font-weight: 700; letter-spacing: -0.035em; line-height: 0.96;
  margin-top: 22px;
}
.learn-hero h1 .italic-accent { color: var(--brand); }

.learn-tag-row {
  margin-top: 36px;
  display: flex; flex-wrap: wrap; gap: 12px;
}
.learn-tag {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 8px 14px;
  border-radius: 100px;
  background: var(--bg-card);
  border: 1px solid var(--border);
  font-size: 13.5px; color: var(--ink-2);
}
.learn-tag .num {
  font-family: var(--font-mono); font-size: 11.5px;
  letter-spacing: 0.06em; text-transform: uppercase;
  color: var(--brand); font-weight: 500;
}

/* TRACK CARDS GRID */
.tracks {
  display: grid; gap: 22px;
  grid-template-columns: 1fr;
}
@media (min-width: 1080px) { .tracks { grid-template-columns: repeat(3, 1fr); } }
.track-card {
  position: relative;
  padding: 36px;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  display: flex; flex-direction: column;
  transition: border-color .15s ease, transform .15s ease, box-shadow .2s ease;
  overflow: hidden;
}
.track-card:hover { border-color: var(--ink); transform: translateY(-4px); box-shadow: var(--shadow-lg); }
.track-card--feature {
  background: var(--ink);
  color: white;
  border-color: var(--ink);
}
.track-card--feature::after {
  content: ""; position: absolute;
  inset: auto -100px -100px auto;
  width: 380px; height: 380px;
  border-radius: 50%;
  background: radial-gradient(closest-side, oklch(0.48 0.20 255 / 0.32), transparent 70%);
  pointer-events: none;
}
.track-card__star {
  display: inline-flex; align-items: center; gap: 6px;
  font-family: var(--font-mono); font-size: 11px;
  letter-spacing: 0.08em; text-transform: uppercase;
  color: var(--accent);
  font-weight: 500;
}
.track-card__tag {
  font-family: var(--font-mono); font-size: 11.5px;
  letter-spacing: 0.08em; text-transform: uppercase;
  color: var(--brand); font-weight: 500;
  position: relative;
}
.track-card--feature .track-card__tag { color: oklch(0.85 0.10 255); }
.track-card__title {
  margin-top: 12px;
  font-size: 30px; font-weight: 700; letter-spacing: -0.025em; line-height: 1.05;
  position: relative;
}
.track-card__sub {
  margin-top: 12px;
  color: var(--ink-2); font-size: 15.5px; line-height: 1.55;
  position: relative;
}
.track-card--feature .track-card__sub { color: oklch(0.78 0.01 250); }
.track-card__meta {
  margin-top: 26px; padding-top: 22px;
  border-top: 1px solid var(--border);
  display: grid; gap: 14px; grid-template-columns: 1fr 1fr;
  position: relative;
}
.track-card--feature .track-card__meta { border-color: oklch(0.30 0.02 250); }
.track-card__meta div span {
  display: block;
  font-family: var(--font-mono); font-size: 10.5px;
  letter-spacing: 0.06em; text-transform: uppercase;
  color: var(--muted);
}
.track-card--feature .track-card__meta div span { color: oklch(0.70 0.01 250); }
.track-card__meta div strong {
  display: block; margin-top: 4px;
  font-size: 16px; font-weight: 600; letter-spacing: -0.01em;
}
.track-card__cta {
  position: relative;
  margin-top: 26px;
  display: inline-flex; align-items: center; gap: 6px;
  color: var(--brand); font-weight: 500;
}
.track-card--feature .track-card__cta { color: oklch(0.85 0.10 255); }
.track-card__cta::after { content: "→"; transition: transform .15s; }
.track-card:hover .track-card__cta::after { transform: translateX(4px); }

/* REFUSE TO BE — sharp negative framing */
.refuse {
  display: grid; gap: 18px;
  grid-template-columns: 1fr;
}
@media (min-width: 760px) { .refuse { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1080px) { .refuse { grid-template-columns: repeat(4, 1fr); } }
.refuse-card {
  padding: 28px;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--radius);
  position: relative;
}
.refuse-card__x {
  width: 32px; height: 32px;
  border-radius: 50%;
  background: oklch(0.95 0.05 25);
  color: oklch(0.55 0.18 25);
  display: grid; place-items: center;
  font-family: var(--font-mono); font-weight: 700; font-size: 13px;
}
.refuse-card__t { margin-top: 16px; font-weight: 600; font-size: 17px; letter-spacing: -0.01em; line-height: 1.3; }
.refuse-card__c { margin-top: 8px; color: var(--ink-2); font-size: 14px; line-height: 1.55; }

/* PILLARS — flagship 4 pillars (you'll have shipped...) */
.pillars-grid {
  display: grid; gap: 16px;
  grid-template-columns: 1fr;
}
@media (min-width: 720px) { .pillars-grid { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1080px) { .pillars-grid { grid-template-columns: 1fr 1fr 1fr; } }
.pillar-card {
  padding: 28px;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--radius);
}
.pillar-card__tag {
  font-family: var(--font-mono); font-size: 11px;
  letter-spacing: 0.08em; text-transform: uppercase;
  color: var(--brand);
}
.pillar-card__t { margin-top: 12px; font-weight: 600; font-size: 19px; letter-spacing: -0.01em; line-height: 1.25; }
.pillar-card__c { margin-top: 8px; color: var(--ink-2); font-size: 14.5px; line-height: 1.55; }

/* CURRICULUM */
.curriculum {
  display: grid; gap: 0;
  border-top: 1px solid var(--border);
}
.cur-block {
  display: grid; gap: 28px;
  grid-template-columns: 1fr;
  padding: clamp(32px, 5vw, 56px) 0;
  border-bottom: 1px solid var(--border);
  align-items: start;
}
@media (min-width: 900px) { .cur-block { grid-template-columns: 1fr 1.6fr; } }
.cur-block__head { position: sticky; top: 88px; }
.cur-block__when {
  font-family: var(--font-mono); font-size: 12px;
  letter-spacing: 0.08em; text-transform: uppercase;
  color: var(--brand); font-weight: 500;
}
.cur-block__t {
  font-size: clamp(26px, 3vw, 36px);
  font-weight: 700; letter-spacing: -0.025em; line-height: 1.05;
  margin-top: 12px; max-width: 16ch;
}
.cur-block__t .italic-accent { color: var(--brand); }
.cur-block__copy { margin-top: 14px; color: var(--ink-2); font-size: 15px; line-height: 1.55; max-width: 44ch; }
.cur-block__list {
  margin: 0; padding: 0; list-style: none;
  display: grid; gap: 10px;
}
.cur-block__list li {
  padding: 16px 18px;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 10px;
  font-size: 15px;
  color: var(--ink);
  display: flex; align-items: flex-start; gap: 12px;
}
.cur-block__list li::before {
  content: "→";
  color: var(--brand);
  font-weight: 600;
  flex: none;
  margin-top: 1px;
}

/* PRICE */
.price-row-3 {
  display: grid; gap: 18px;
  grid-template-columns: 1fr;
}
@media (min-width: 800px) { .price-row-3 { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1100px) { .price-row-3 { grid-template-columns: repeat(3, 1fr); } }
.price-card-lg {
  padding: 32px;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
}
.price-card-lg--feature {
  background: var(--ink);
  color: white;
  border-color: var(--ink);
  position: relative;
}
.price-card-lg__tag {
  font-family: var(--font-mono); font-size: 11.5px;
  letter-spacing: 0.06em; text-transform: uppercase;
  color: var(--muted);
}
.price-card-lg--feature .price-card-lg__tag { color: oklch(0.85 0.10 255); }
.price-card-lg__name { margin-top: 12px; font-size: 24px; font-weight: 700; letter-spacing: -0.02em; }
.price-card-lg__row {
  margin-top: 22px;
  display: grid; gap: 14px; grid-template-columns: 1fr 1fr;
}
.price-card-lg__cell {
  padding: 18px;
  background: var(--bg-subtle);
  border-radius: 10px;
}
.price-card-lg--feature .price-card-lg__cell { background: oklch(0.22 0.02 250); }
.price-card-lg__cell-h {
  font-family: var(--font-mono); font-size: 10.5px;
  letter-spacing: 0.06em; text-transform: uppercase;
  color: var(--muted);
}
.price-card-lg--feature .price-card-lg__cell-h { color: oklch(0.78 0.01 250); }
.price-card-lg__cell-v { margin-top: 6px; font-size: 22px; font-weight: 700; letter-spacing: -0.02em; }

/* APPLY FORM */
.apply-band {
  background: var(--ink);
  color: white;
  border-radius: var(--radius-lg);
  padding: clamp(40px, 6vw, 80px);
  position: relative;
  overflow: hidden;
}
.apply-band::after {
  content: ""; position: absolute;
  inset: auto -150px -200px auto;
  width: 600px; height: 600px;
  border-radius: 50%;
  background: radial-gradient(closest-side, oklch(0.48 0.20 255 / 0.30), transparent 70%);
  pointer-events: none;
}
.apply-band__inner {
  position: relative;
  display: grid; gap: 48px;
  grid-template-columns: 1fr; align-items: start;
}
@media (min-width: 920px) { .apply-band__inner { grid-template-columns: 1fr 1.1fr; } }
.apply-band h2 {
  font-size: clamp(34px, 4.5vw, 56px);
  font-weight: 700; letter-spacing: -0.03em; line-height: 1.0;
}
.apply-band h2 .italic-accent { color: oklch(0.85 0.10 255); }
.apply-band p { color: oklch(0.78 0.01 250); margin-top: 18px; font-size: 17px; line-height: 1.55; max-width: 48ch; }

.contact-direct {
  margin-top: 32px;
  padding: 24px;
  background: oklch(0.22 0.02 250);
  border: 1px solid oklch(0.30 0.02 250);
  border-radius: 14px;
}
.contact-direct__l {
  font-family: var(--font-mono); font-size: 11.5px;
  letter-spacing: 0.06em; text-transform: uppercase;
  color: oklch(0.85 0.10 255);
}
.contact-direct__lines {
  margin-top: 14px;
  display: grid; gap: 14px;
}
.contact-direct__lines a {
  display: flex; align-items: center; gap: 14px;
  font-size: 18px; font-weight: 600;
  color: white;
  letter-spacing: -0.01em;
}
.contact-direct__lines a:hover { color: oklch(0.85 0.10 255); }
.contact-direct__lines .ic {
  width: 36px; height: 36px;
  border-radius: 10px;
  background: oklch(0.18 0.02 250);
  display: grid; place-items: center;
  font-family: var(--font-mono); font-size: 12px;
  color: oklch(0.85 0.10 255);
}
.contact-direct__hours {
  margin-top: 18px;
  font-family: var(--font-mono); font-size: 12px;
  color: oklch(0.70 0.01 250); letter-spacing: 0.04em;
}

.apply-form {
  background: white;
  border-radius: var(--radius-lg);
  padding: clamp(28px, 4vw, 40px);
  position: relative;
  color: var(--ink);
  box-shadow: var(--shadow-lg);
}
.apply-form h3 {
  font-size: 22px; font-weight: 700; letter-spacing: -0.02em;
}
.apply-form .muted { color: var(--muted); font-size: 14px; margin-top: 6px; }

/* WHATSAPP FLOAT */
.wa-float {
  position: fixed;
  bottom: 24px; right: 24px;
  z-index: 60;
  background: oklch(0.62 0.18 145);
  color: white;
  border-radius: 100px;
  padding: 14px 20px;
  font-weight: 600;
  font-size: 14.5px;
  display: inline-flex; align-items: center; gap: 10px;
  box-shadow: 0 12px 30px -8px oklch(0.62 0.18 145 / 0.5), 0 4px 12px rgba(15,20,40,.15);
  transition: transform .15s ease;
}
.wa-float:hover { transform: translateY(-2px); }
.wa-float::before {
  content: "";
  width: 22px; height: 22px;
  background: white;
  mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M17.472 14.382c-.297-.149-1.758-.867-2.03-.967-.273-.099-.471-.148-.67.15-.197.297-.767.966-.94 1.164-.173.199-.347.223-.644.075-.297-.15-1.255-.463-2.39-1.475-.883-.788-1.48-1.761-1.653-2.059-.173-.297-.018-.458.13-.606.134-.133.298-.347.446-.52.149-.174.198-.298.298-.497.099-.198.05-.371-.025-.52-.075-.149-.669-1.612-.916-2.207-.242-.579-.487-.5-.669-.51-.173-.008-.371-.01-.57-.01-.198 0-.52.074-.792.372-.272.297-1.04 1.016-1.04 2.479 0 1.462 1.065 2.875 1.213 3.074.149.198 2.095 3.2 5.076 4.487.71.306 1.263.489 1.694.625.712.227 1.36.195 1.872.118.571-.085 1.758-.719 2.006-1.413.248-.694.248-1.289.173-1.413-.074-.124-.272-.198-.57-.347zM12.05 22h-.005a9.87 9.87 0 0 1-5.031-1.378l-.36-.214-3.741.982.998-3.648-.235-.374a9.86 9.86 0 0 1-1.51-5.26c.001-5.45 4.436-9.884 9.888-9.884a9.82 9.82 0 0 1 6.992 2.898 9.825 9.825 0 0 1 2.893 6.994c-.003 5.45-4.437 9.884-9.889 9.884zM20.52 3.449C18.243 1.17 15.222.001 12.057 0 5.495 0 .16 5.335.157 11.892c0 2.096.547 4.142 1.588 5.945L.057 24l6.305-1.654a11.882 11.882 0 0 0 5.683 1.448h.005c6.554 0 11.89-5.335 11.893-11.893 0-3.181-1.241-6.169-3.49-8.434z'/></svg>") center/contain no-repeat;
  -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M17.472 14.382c-.297-.149-1.758-.867-2.03-.967-.273-.099-.471-.148-.67.15-.197.297-.767.966-.94 1.164-.173.199-.347.223-.644.075-.297-.15-1.255-.463-2.39-1.475-.883-.788-1.48-1.761-1.653-2.059-.173-.297-.018-.458.13-.606.134-.133.298-.347.446-.52.149-.174.198-.298.298-.497.099-.198.05-.371-.025-.52-.075-.149-.669-1.612-.916-2.207-.242-.579-.487-.5-.669-.51-.173-.008-.371-.01-.57-.01-.198 0-.52.074-.792.372-.272.297-1.04 1.016-1.04 2.479 0 1.462 1.065 2.875 1.213 3.074.149.198 2.095 3.2 5.076 4.487.71.306 1.263.489 1.694.625.712.227 1.36.195 1.872.118.571-.085 1.758-.719 2.006-1.413.248-.694.248-1.289.173-1.413-.074-.124-.272-.198-.57-.347zM12.05 22h-.005a9.87 9.87 0 0 1-5.031-1.378l-.36-.214-3.741.982.998-3.648-.235-.374a9.86 9.86 0 0 1-1.51-5.26c.001-5.45 4.436-9.884 9.888-9.884a9.82 9.82 0 0 1 6.992 2.898 9.825 9.825 0 0 1 2.893 6.994c-.003 5.45-4.437 9.884-9.889 9.884zM20.52 3.449C18.243 1.17 15.222.001 12.057 0 5.495 0 .16 5.335.157 11.892c0 2.096.547 4.142 1.588 5.945L.057 24l6.305-1.654a11.882 11.882 0 0 0 5.683 1.448h.005c6.554 0 11.89-5.335 11.893-11.893 0-3.181-1.241-6.169-3.49-8.434z'/></svg>") center/contain no-repeat;
}

/* FOUNDERS — student-facing voice */
.founders-row { display: grid; gap: 24px; grid-template-columns: 1fr; }
@media (min-width: 800px) { .founders-row { grid-template-columns: 1fr 1fr; } }
.founder-q {
  padding: 36px;
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  display: flex; flex-direction: column;
}
.founder-q__head {
  display: flex; gap: 16px; align-items: center;
}
.founder-q__avatar {
  width: 52px; height: 52px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--brand-soft), var(--brand));
  color: white;
  display: grid; place-items: center;
  font-weight: 700; font-size: 20px;
}
.founder-q__name { font-size: 20px; font-weight: 700; letter-spacing: -0.02em; }
.founder-q__role { font-family: var(--font-mono); font-size: 11.5px; color: var(--muted); text-transform: uppercase; letter-spacing: 0.06em; margin-top: 2px; }
.founder-q__quote {
  margin-top: 22px;
  font-size: 19px; font-weight: 500;
  letter-spacing: -0.015em;
  line-height: 1.4;
  color: var(--ink);
}
.founder-q__quote::before, .founder-q__quote::after { color: var(--brand); }
.founder-q__quote::before { content: "“"; }
.founder-q__quote::after { content: "”"; }
.founder-q__c { margin-top: 18px; color: var(--ink-2); font-size: 14.5px; line-height: 1.55; }