.education-page,
.advisor-page { background: #f7faf4; }

.learning-hero {
  display: grid;
  grid-template-columns: minmax(0, 1.12fr) minmax(340px, 0.88fr);
  align-items: end;
  min-height: 620px;
  padding: 104px max(26px, calc((100% - 1240px) / 2)) 78px;
  background: var(--commerce-forest);
  color: white;
}
.learning-hero-copy { max-width: 760px; padding-right: 7vw; }
.learning-hero-copy > span,
.education-heading span,
.beginner-pathway > div > span,
.advisor-hero-copy > span,
.ask-hamoy-intro > span,
.authority-system-copy > span,
.advisor-next span {
  color: var(--commerce-pistachio);
  font: 700 10px/1.4 var(--sans);
  letter-spacing: 0.13em;
  text-transform: uppercase;
}
.learning-hero h1 {
  max-width: 760px;
  margin: 20px 0 26px;
  color: white;
  font: 500 72px/0.98 var(--serif);
}
.learning-hero-copy > p {
  max-width: 640px;
  margin-bottom: 34px;
  color: rgba(255, 255, 255, 0.76);
  font: 400 16px/1.8 var(--sans);
}
.learning-hero .btn-primary { background: var(--commerce-pistachio); color: var(--commerce-ink); }
.learning-progress-overview {
  align-self: end;
  padding: 36px 0 12px 42px;
  border-left: 1px solid rgba(197, 225, 165, 0.3);
}
.learning-progress-overview > span { color: rgba(255, 255, 255, 0.64); font: 600 9px/1.4 var(--sans); letter-spacing: 0.1em; text-transform: uppercase; }
.learning-progress-overview > strong { display: block; margin: 18px 0; color: white; font: 500 54px/1 var(--serif); }
.learning-progress-overview > strong b { color: var(--commerce-pistachio); font-weight: 500; }
.learning-progress-track { width: 100%; height: 4px; overflow: hidden; background: rgba(255, 255, 255, 0.18); }
.learning-progress-track i { display: block; width: 0; height: 100%; background: var(--commerce-sage); transition: width 0.35s ease; }
.learning-progress-overview p { margin-top: 14px; color: rgba(255, 255, 255, 0.56); font: 400 10px/1.6 var(--sans); }

.lesson-library { padding: 110px max(26px, calc((100% - 1240px) / 2)); }
.education-heading {
  display: grid;
  grid-template-columns: 1.2fr 0.8fr;
  gap: 80px;
  align-items: end;
  margin-bottom: 54px;
}
.education-heading span,
.beginner-pathway > div > span,
.ask-hamoy-intro > span,
.authority-system-copy > span,
.advisor-next span { color: var(--commerce-olive); }
.education-heading h2,
.beginner-pathway h2,
.ask-hamoy-intro h2,
.authority-system h2,
.advisor-next h2 {
  margin-top: 14px;
  color: var(--commerce-ink);
  font: 500 48px/1.08 var(--serif);
}
.education-heading > p {
  color: var(--commerce-copy);
  font: 400 14px/1.8 var(--sans);
}
.lesson-grid { display: grid; grid-template-columns: 1fr 1fr; border-top: 1px solid var(--commerce-line); border-left: 1px solid var(--commerce-line); }
.lesson-card { display: grid; grid-template-columns: 0.88fr 1.12fr; min-height: 360px; border-right: 1px solid var(--commerce-line); border-bottom: 1px solid var(--commerce-line); background: white; }
.lesson-card-media { position: relative; min-width: 0; padding: 0; overflow: hidden; border: 0; background: var(--commerce-mint); cursor: pointer; }
.lesson-card-media img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.55s ease; }
.lesson-card:hover .lesson-card-media img { transform: scale(1.025); }
.lesson-card-media span { position: absolute; top: 16px; left: 16px; display: grid; place-items: center; width: 34px; height: 34px; background: rgba(22, 32, 24, 0.78); color: white; font: 600 10px var(--sans); }
.lesson-card > div { position: relative; display: flex; flex-direction: column; justify-content: center; padding: 36px; }
.lesson-card > div > span { color: var(--commerce-olive); font: 700 9px/1.4 var(--sans); letter-spacing: 0.1em; text-transform: uppercase; }
.lesson-card h3 { margin: 14px 0; color: var(--commerce-ink); font: 500 28px/1.12 var(--serif); }
.lesson-card p { color: var(--commerce-copy); font: 400 12px/1.7 var(--sans); }
.lesson-start { align-self: flex-start; margin-top: 26px; padding: 0 0 6px; border: 0; border-bottom: 1px solid var(--commerce-forest); background: transparent; color: var(--commerce-forest); cursor: pointer; font: 700 9px/1.2 var(--sans); letter-spacing: 0.1em; text-transform: uppercase; }
.lesson-start i { margin-left: 7px; font-style: normal; }
.lesson-card small { position: absolute; right: 16px; top: 16px; padding: 6px 8px; background: var(--commerce-mint); color: var(--commerce-forest); font: 700 8px/1 var(--sans); letter-spacing: 0.08em; text-transform: uppercase; }

.lesson-workspace { display: grid; grid-template-columns: 1fr 1fr; align-items: start; background: #e8f1e3; scroll-margin-top: 40px; }
.lesson-workspace[hidden] { display: none; }
.lesson-workspace-media { position: sticky; top: 108px; min-height: 0; overflow: hidden; background: var(--commerce-forest); }
.lesson-workspace-media video { display: block; width: 100%; aspect-ratio: 16 / 9; background: #142d1a; object-fit: contain; }
.lesson-workspace-media img { width: 100%; height: 100%; object-fit: cover; }
.lesson-workspace-media > span {
  display: block;
  padding: 11px 16px;
  background: rgba(22, 32, 24, 0.92);
  color: rgba(255, 255, 255, 0.82);
  font: 400 9px/1.5 var(--sans);
}
.lesson-workspace-copy { position: relative; display: flex; flex-direction: column; justify-content: center; padding: 76px 7vw; }
.lesson-close { position: absolute; right: 26px; top: 22px; width: 38px; height: 38px; border: 1px solid var(--commerce-line); background: transparent; color: var(--commerce-ink); cursor: pointer; font-size: 23px; font-weight: 300; }
.lesson-workspace-copy > span { color: var(--commerce-olive); font: 700 9px/1.4 var(--sans); letter-spacing: 0.1em; text-transform: uppercase; }
.lesson-workspace-copy h2 { margin: 15px 0 18px; color: var(--commerce-ink); font: 500 44px/1.08 var(--serif); }
.lesson-workspace-copy > p { color: var(--commerce-copy); font: 400 14px/1.75 var(--sans); }
.lesson-module { margin-top: 25px; padding-top: 21px; border-top: 1px solid var(--commerce-line); }
.lesson-module > strong { color: var(--commerce-olive); font: 700 9px/1.4 var(--sans); letter-spacing: 0.09em; text-transform: uppercase; }
.lesson-module > p { margin-top: 10px; color: var(--commerce-copy); font: 400 11px/1.7 var(--sans); }
.lesson-module ul { display: grid; gap: 8px; margin: 12px 0 0; padding: 0; list-style: none; }
.lesson-module ul li { position: relative; display: block; padding: 0 0 0 17px; border: 0; color: var(--commerce-copy); font: 400 11px/1.65 var(--sans); }
.lesson-module ul li::before { position: absolute; left: 0; top: 0.72em; width: 5px; height: 5px; border-radius: 50%; background: var(--commerce-sage); content: ""; }
.lesson-mistakes { padding: 21px 20px 20px; border-top: 0; background: rgba(255,255,255,.52); }
.lesson-practice-plan { padding-bottom: 2px; }
.lesson-workspace-copy ol { margin: 12px 0 0; padding: 0; list-style: none; border-top: 1px solid var(--commerce-line); }
.lesson-workspace-copy li { display: grid; grid-template-columns: 40px 1fr; gap: 12px; padding: 18px 0; border-bottom: 1px solid var(--commerce-line); }
.lesson-workspace-copy li b { color: var(--commerce-sage); font: 500 15px var(--serif); }
.lesson-workspace-copy li span { color: var(--commerce-copy); font: 400 12px/1.65 var(--sans); }
.lesson-safety { margin-top: 24px; padding: 18px; border-left: 3px solid var(--commerce-sage); background: rgba(255, 255, 255, 0.56); }
.lesson-safety strong { color: var(--commerce-ink); font: 700 9px/1.4 var(--sans); letter-spacing: 0.08em; text-transform: uppercase; }
.lesson-safety p { margin-top: 8px; color: var(--commerce-copy); font: 400 10px/1.65 var(--sans); }
.lesson-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 24px; margin-top: 28px; }
.lesson-actions .btn-primary:disabled { opacity: 0.54; cursor: default; transform: none; }

.beginner-pathway,
.advisor-next {
  display: grid;
  grid-template-columns: 1fr 0.8fr auto;
  gap: 70px;
  align-items: center;
  padding: 82px max(26px, calc((100% - 1240px) / 2));
  background: white;
}
.beginner-pathway > p { color: var(--commerce-copy); font: 400 14px/1.8 var(--sans); }
.beginner-pathway .btn-ghost { white-space: nowrap; }
.learning-disclosure {
  display: grid;
  grid-template-columns: 0.42fr 1.58fr;
  gap: 60px;
  padding: 44px max(26px, calc((100% - 1240px) / 2));
  border-top: 1px solid var(--commerce-line);
  background: #f7faf4;
}
.learning-disclosure strong { color: var(--commerce-ink); font: 600 13px/1.5 var(--serif); }
.learning-disclosure p { color: var(--commerce-copy); font: 400 10px/1.75 var(--sans); }

.advisor-hero { position: relative; min-height: 720px; overflow: hidden; background: var(--commerce-ink); }
.advisor-hero > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.advisor-hero-overlay { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(11, 29, 16, 0.83) 0%, rgba(11, 29, 16, 0.48) 46%, rgba(11, 29, 16, 0.05) 76%); }
.advisor-hero-copy { position: relative; z-index: 2; width: min(100% - 52px, 1240px); margin: 0 auto; padding-top: 180px; color: white; }
.advisor-hero-copy h1 { margin: 18px 0 16px; color: white; font: 500 104px/0.92 var(--serif); }
.advisor-hero-copy p { max-width: 570px; margin-bottom: 34px; color: rgba(255, 255, 255, 0.8); font: 400 16px/1.8 var(--sans); }
.advisor-hero .btn-primary { background: var(--commerce-pistachio); color: var(--commerce-ink); }
.advisor-trust { display: grid; grid-template-columns: repeat(4, 1fr); background: white; border-bottom: 1px solid var(--commerce-line); }
.advisor-trust > div { min-height: 190px; padding: 32px 3vw; border-right: 1px solid var(--commerce-line); }
.advisor-trust > div:last-child { border-right: 0; }
.advisor-trust b { display: block; color: var(--commerce-sage); font: 500 13px var(--serif); }
.advisor-trust strong { display: block; margin: 30px 0 9px; color: var(--commerce-ink); font: 600 17px/1.3 var(--serif); }
.advisor-trust span { color: var(--commerce-copy); font: 400 10px/1.65 var(--sans); }

.ask-hamoy { display: grid; grid-template-columns: 0.8fr 1.2fr; gap: 90px; width: min(100% - 52px, 1240px); margin: 0 auto; padding: 120px 0; }
.ask-hamoy-intro > p { margin: 24px 0 34px; color: var(--commerce-copy); font: 400 14px/1.8 var(--sans); }
.hamoy-options { display: grid; border-top: 1px solid var(--commerce-line); }
.hamoy-options button { display: grid; grid-template-columns: 38px 1fr; gap: 14px; align-items: center; min-height: 62px; padding: 0 12px; border: 0; border-bottom: 1px solid var(--commerce-line); background: transparent; color: var(--commerce-copy); text-align: left; cursor: pointer; transition: background 0.2s ease, color 0.2s ease; }
.hamoy-options button b { color: var(--commerce-sage); font: 500 12px var(--serif); }
.hamoy-options button span { font: 600 11px/1.4 var(--sans); }
.hamoy-options button.active { background: var(--commerce-forest); color: white; }
.hamoy-answer { align-self: start; padding: 54px; background: #e8f1e3; }
.hamoy-answer-head { display: flex; align-items: center; gap: 18px; padding-bottom: 24px; border-bottom: 1px solid var(--commerce-line); }
.hamoy-answer-head img { width: 62px; height: 62px; object-fit: contain; }
.hamoy-answer-head span { color: var(--commerce-olive); font: 700 9px/1.4 var(--sans); letter-spacing: 0.1em; text-transform: uppercase; }
.hamoy-answer-head h3 { margin-top: 7px; color: var(--commerce-ink); font: 500 32px/1.1 var(--serif); }
.answer-source-labels { display: grid; margin-top: 26px; }
.answer-source-labels > span { margin: 18px 0 8px; color: var(--commerce-olive); font: 700 9px/1.4 var(--sans); letter-spacing: 0.1em; text-transform: uppercase; }
.answer-source-labels > p { color: var(--commerce-copy); font: 400 12px/1.75 var(--sans); }
.answer-source-labels ol { padding: 0; list-style: none; border-top: 1px solid var(--commerce-line); }
.answer-source-labels li { display: grid; grid-template-columns: 35px 1fr; gap: 10px; padding: 13px 0; border-bottom: 1px solid var(--commerce-line); }
.answer-source-labels li b { color: var(--commerce-sage); font: 500 12px var(--serif); }
.answer-source-labels li span { color: var(--commerce-copy); font: 400 11px/1.55 var(--sans); }
.hamoy-answer-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 24px; margin-top: 30px; }

.authority-system { display: grid; grid-template-columns: 0.8fr 1.2fr; gap: 90px; padding: 112px max(26px, calc((100% - 1240px) / 2)); background: var(--commerce-forest); }
.authority-system-copy > span { color: var(--commerce-pistachio); }
.authority-system h2 { color: white; }
.authority-system-list { border-top: 1px solid rgba(255, 255, 255, 0.2); }
.authority-system-list article { display: grid; grid-template-columns: 0.65fr 1.35fr; gap: 30px; padding: 25px 0; border-bottom: 1px solid rgba(255, 255, 255, 0.2); }
.authority-system-list strong { color: white; font: 600 14px/1.4 var(--serif); }
.authority-system-list p { color: rgba(255, 255, 255, 0.66); font: 400 11px/1.7 var(--sans); }
.advisor-next { grid-template-columns: 1fr auto; }

@media (max-width: 980px) {
  .learning-hero { grid-template-columns: 1fr; gap: 52px; }
  .learning-progress-overview { padding-left: 0; border-left: 0; }
  .lesson-grid { grid-template-columns: 1fr; }
  .lesson-workspace { grid-template-columns: 1fr; }
  .lesson-workspace-media { position: relative; top: auto; min-height: 0; }
  .beginner-pathway { grid-template-columns: 1fr; gap: 24px; }
  .advisor-trust { grid-template-columns: 1fr 1fr; }
  .advisor-trust > div:nth-child(2) { border-right: 0; }
  .ask-hamoy, .authority-system { grid-template-columns: 1fr; gap: 54px; }
}

@media (max-width: 600px) {
  .learning-hero { min-height: 620px; padding: 78px 20px 58px; }
  .learning-hero h1 { font-size: 48px; }
  .lesson-library { padding: 74px 16px; }
  .education-heading { grid-template-columns: 1fr; gap: 20px; }
  .education-heading h2, .beginner-pathway h2, .ask-hamoy-intro h2, .authority-system h2, .advisor-next h2 { font-size: 34px; }
  .lesson-card { grid-template-columns: 1fr; }
  .lesson-card-media { min-height: 310px; }
  .lesson-card > div { padding: 28px; }
  .lesson-workspace-media { min-height: 0; }
  .lesson-workspace-copy { padding: 58px 22px; }
  .lesson-workspace-copy h2 { font-size: 34px; }
  .learning-disclosure { grid-template-columns: 1fr; gap: 16px; }
  .advisor-hero { min-height: 650px; }
  .advisor-hero > img { object-position: 64% center; }
  .advisor-hero-overlay { background: linear-gradient(90deg, rgba(11, 29, 16, 0.85) 0%, rgba(11, 29, 16, 0.52) 68%, rgba(11, 29, 16, 0.18) 100%); }
  .advisor-hero-copy { width: calc(100% - 40px); padding-top: 145px; }
  .advisor-hero-copy h1 { font-size: 74px; }
  .advisor-trust { grid-template-columns: 1fr; }
  .advisor-trust > div { min-height: 150px; border-right: 0; border-bottom: 1px solid var(--commerce-line); }
  .advisor-trust strong { margin-top: 18px; }
  .ask-hamoy { width: calc(100% - 32px); padding: 78px 0; }
  .hamoy-answer { padding: 30px 22px; }
  .hamoy-answer-head h3 { font-size: 26px; }
  .authority-system { padding: 78px 20px; }
  .authority-system-list article { grid-template-columns: 1fr; gap: 9px; }
  .advisor-next { grid-template-columns: 1fr; gap: 24px; padding: 64px 20px; }
}

@media (prefers-reduced-motion: reduce) {
  .lesson-card-media img,
  .learning-progress-track i { transition: none; }
}
