/*
 * Course page template (page-course.php). Layout follows the Figma auto-layout: flex/grid with the Figma gaps and
 * paddings, content-driven heights, images with height:auto. Per-course art is chosen with the custom properties in
 * the "course variants" block at the end (svg gradient files + a few numbers); everything else is shared.
 */
:root {
  --course-wine: var(--c-crimson);
  --course-muted: #aeaeae;
  --course-dark: #171819;
}

.c-course-page { overflow-x: clip; }
.c-course-page img { height: auto; }
.c-course-art { position: absolute; max-width: none; pointer-events: none; }
.c-course-page :where(h1, h2, h3, p, ul) { margin: 0; }
.c-course-page :where(ul) { padding: 0; list-style: none; }

/* headings / bullets shared by all sections */
.c-course-goal__title, .c-course-value__title, .c-course-audience__title, .c-course-struct__title,
.c-course-model__title, .c-course-coach__title, .c-course-gallery__title { font: 500 52px/59px var(--font-display); }
.c-course-goal__list, .c-course-value__list:not(.has-titles), .c-course-audience__list { padding-left: 25.5px; }
.c-course-goal__list li, .c-course-value__list:not(.has-titles) li, .c-course-audience__list li { list-style: disc; }

/* ---------- hero + goal ---------- */
.c-course-top { position: relative; overflow: hidden; background: #000; }
.c-course-top::before { content: ""; position: absolute; top: 18px; right: 0; left: 0; height: 880px; background: url("../img/course/course-bg-hero.svg") 0 0 / 100% 100% no-repeat; pointer-events: none; }
.c-course-art--hero { top: 67px; left: 0; width: 100%; min-width: 1440px; mix-blend-mode: overlay; }
.c-course-hero { position: relative; padding-top: var(--hero-pt, 150px); }
.c-course-hero__inner { display: flex; flex-direction: column; align-items: center; gap: 12px; box-sizing: border-box; height: 450px; padding-top: 175px; margin-bottom: calc(var(--hero-pull, 101px) * -1); text-align: center; }
.c-course-hero__title { font: 500 60px/56px var(--font-display); text-transform: uppercase; white-space: nowrap; }
.c-course-hero__subtitle { font: 500 22px/32px var(--font-display); }
.c-course-hero__note { font: 400 17px/24px var(--font-ui); }
.c-course-hero__cta { margin-top: 30px; }
.c-course-goal { position: relative; box-sizing: border-box; min-height: var(--goal-h, 0); padding-block: var(--goal-pt, 87px) 87px; }
.c-course-goal__title { margin-bottom: 8px; }
.c-course-goal__lead { max-width: 1079px; margin-bottom: 31px; font: 500 22px/32px var(--font-display); }
.c-course-goal__list { display: grid; gap: 14px; font: 400 17px/24px var(--font-ui); }

/* ---------- value + audience ---------- */
.c-course-mid { color: #fff; background: url("../img/course/course-bg-diamond.svg") 0 0 / 100% 100% no-repeat; }
.c-course-value { padding-block: var(--value-pad, 69px 59px); background: var(--bg-value, none) 0 0 / 100% 100% no-repeat; }
.c-course-value__inner { display: flex; align-items: center; gap: 94px; width: min(100% - 40px, 1152px); margin-inline: auto; }
.c-course-value__title { flex: 0 1 525px; min-width: 0; box-sizing: border-box; padding: 10px; }
.c-course-value__list { display: grid; flex: 1; min-width: 0; gap: var(--value-gap, 18px); font: 400 17px/24px var(--font-ui); }
.c-course-value__list li { padding: var(--value-item-pad, 0); }
.c-course-value__list.has-titles { flex: 1 1 533px; min-width: 0; gap: 49px; counter-reset: value; }
.c-course-value__list.has-titles li { display: grid; grid-template-columns: 57px 1fr; align-items: center; gap: 10px; counter-increment: value; }
.c-course-value__list.has-titles li::before { content: counter(value); display: grid; height: 114px; align-items: center; background: linear-gradient(#fff 59%, rgba(153, 153, 153, 0)); -webkit-background-clip: text; background-clip: text; color: transparent; font: 400 96px/40px var(--font-display); }
.c-course-value__item-title { font: 500 32px/34px var(--font-display); }
.c-course-value__item-text { grid-column: 1 / -1; }
.c-course-audience { position: relative; display: flex; align-items: center; justify-content: flex-end; min-height: 547px; overflow: hidden; background: var(--audience-fade, linear-gradient(var(--course-dark), rgba(23, 24, 25, 0) 54.3%, var(--course-dark))); }
.c-course-art--audience { top: var(--aud-y, -34px); left: calc(50% + var(--aud-x, -584px)); width: var(--aud-w, 547px); }
.c-course-audience__body { position: relative; display: flex; flex-direction: column; gap: 14px; width: min(521px, 100%); margin-right: max(calc((100% - 1152px) / 2), 20px); }
.c-course-audience__lead { font: 500 22px/32px var(--font-display); }
.c-course-audience__list { display: grid; gap: 14px; padding-left: 33px; font: 500 22px/32px var(--font-display); }
.c-course-audience__note { font: 400 18px/1.386 var(--font-ui); }

/* ---------- structure (fixed-height body, tab list scrolls) ---------- */
.c-course-struct { position: relative; overflow: hidden; padding-block: 73px; color: #000; background: #fff; }
.c-course-art--struct { top: var(--struct-art-y, 29px); left: calc(50% + var(--struct-art-x, -588px)); width: var(--struct-art-w, 1180px); opacity: .075; }
.c-course-struct .c-container { position: relative; }
.c-course-struct__title { margin-bottom: 14px; color: var(--course-wine); }
.c-course-struct__subtitle { color: var(--course-wine); font: 500 22px/32px var(--font-display); }
.c-course-struct__body { display: flex; justify-content: space-between; gap: 40px; height: var(--struct-h, 340px); margin-top: 29px; overflow: hidden; }
.c-course-struct__panels { flex: 0 1 798px; min-width: 0; }
.c-course-struct__panel[hidden] { display: none; }
.c-course-struct__panel { display: grid; grid-template-columns: 185px 53px 1fr; align-items: center; gap: 12px; }
.c-course-struct__label { justify-self: start; padding: 8px 17px; border: 1px solid #000; border-radius: 38px; font: 500 15px/20px var(--font-display); opacity: .5; }
.c-course-struct__num { padding-block: 37px; color: var(--course-wine); font: 400 96px/40px var(--font-display); }
.c-course-struct__name { font: 500 27px/31px var(--font-display); text-transform: uppercase; }
.c-course-struct__caption { display: block; font: 500 14px/20px var(--font-ui); text-transform: none; }
.c-course-struct__rule { grid-column: 1 / -1; width: 100%; height: 1px; margin: 0; border: 0; background: #000; }
.c-course-struct__content { grid-column: 1 / -1; display: grid; grid-template-columns: 185px 1fr; column-gap: 4px; align-items: start; }
.c-course-struct__side { font: 500 14px/20px var(--font-ui); text-transform: uppercase; }
.c-course-struct__items { display: grid; grid-column: 2; gap: 10px; font: 400 17px/1.386 var(--font-ui); counter-reset: item; }
.c-course-struct__items li { padding: 0 8px var(--struct-item-pb, 8px) 0; }
.c-course-struct__items li.has-title { position: relative; padding-left: 48px; counter-increment: item; }
.c-course-struct__items li.has-title::before { content: counter(item); position: absolute; top: 0; left: 0; display: grid; width: 32px; height: 32px; place-items: center; border-radius: 50%; background: var(--course-wine); color: #fff; font: 500 17px/1 var(--font-ui); }
.c-course-struct__item-title { display: block; color: var(--course-wine); font: 500 26px/32px var(--font-display); }
.c-course-struct__tabs { display: flex; flex: 0 0 294px; flex-direction: column; gap: var(--tab-gap, 15px); overflow-y: auto; padding-block: 20px; }
.c-course-struct__tab { display: flex; flex: none; align-items: stretch; gap: 10px; padding: 0 2px; border: 0; background: none; color: var(--course-muted); text-align: left; font: 500 17px/21px var(--font-ui); cursor: pointer; }
.c-course-struct__tab.is-active { color: var(--course-wine); }
.c-course-struct__bar { flex: none; width: 4px; border-radius: 100px; background: currentColor; }
.c-course-struct__tabtext { display: flex; align-items: center; gap: 10px; }
.c-course-struct__tabname { text-transform: uppercase; white-space: nowrap; }

/* ---------- model ---------- */
.c-course-model { padding-block: 50px; background: #000; color: #fff; }
.c-course-model__inner { display: flex; align-items: center; justify-content: space-between; gap: 40px; min-height: 340px; }
.c-course-model__intro { display: flex; flex: 0 1 457px; flex-direction: column; gap: 12px; min-width: 0; }
.c-course-model__text { font: 500 14px/20px var(--font-ui); }
.c-course-model__list { display: grid; flex: 0 1 496px; gap: 60px; min-width: 0; }
.c-course-model__item { position: relative; display: grid; grid-template-columns: 32px 1fr; align-items: center; gap: 10px; font: 400 17px/24px var(--font-ui); }
.c-course-model__item + .c-course-model__item::before { content: ""; position: absolute; top: -47px; left: 15px; width: 1px; height: 34px; background: rgba(255, 255, 255, .5); }
.c-course-model__icon { display: grid; place-items: center; }
.c-course-model__icon img { width: 30px; }
.c-course-model__item-title { display: block; font: 500 26px/32px var(--font-display); }
.c-course-model__item.has-title { grid-template-columns: 32px minmax(0, 302px) minmax(0, 319px); align-items: start; column-gap: 16px; }
.c-course-model__item.has-title::before { display: none; }
.c-course-model__item.has-title .c-course-model__copy { display: contents; }
.c-course-model__item.has-title .c-course-model__item-title { align-self: start; }
.c-course-model__list:has(.has-title) { flex: 0 1 685px; gap: 60px; }
.c-course-model__inner:has(.has-title) { align-items: flex-start; }

/* ---------- coach ---------- */
.c-course-coach { position: relative; overflow: hidden; padding-top: 75px; color: #fff; background: linear-gradient(var(--c-crimson) 21%, var(--c-crimson-dark) 88%); }
.c-course-art--coach { top: var(--coach-art-y, -66px); left: 0; width: 100%; min-width: 1439px; mix-blend-mode: multiply; }
.c-course-coach .c-container { position: relative; }
.c-course-coach__head { display: grid; gap: 8px; width: min(1142px, 100%); }
.c-course-coach__intro { font: 500 22px/32px var(--font-display); }
.c-course-coach__slides { position: relative; margin-top: 16px; }
.c-course-coach__detail { display: flex; align-items: center; justify-content: space-between; width: min(946px, 100%); margin-inline: auto; }
.c-course-coach__detail[hidden] { display: none; }
.c-course-coach__photo { position: relative; flex: 0 0 425px; align-self: flex-end; height: 680px; }
.c-course-coach__photo img { position: absolute; top: -63px; left: -18px; width: 461px; max-width: none; transform: scaleX(-1); }
.c-course-coach__info { display: flex; flex: 0 0 410px; flex-direction: column; gap: 32px; }
.c-course-coach__who { display: grid; gap: 4px; }
.c-course-coach__label { font: 500 14px/20px var(--font-ui); letter-spacing: .08em; text-transform: uppercase; }
.c-course-coach__name { font: 500 32px/34px var(--font-display); }
.c-course-coach__role { font: 500 23px/1.3 var(--font-display); }
.c-course-coach__company { font: 500 17px/21px var(--font-ui); }
.c-course-coach__bio { display: grid; gap: 9px; width: 482px; font: 400 17px/1.386 var(--font-ui); }
.c-course-coach__projects { display: grid; gap: 10px; font: 400 17px/1.386 var(--font-ui); }
.c-course-coach__logos { display: flex; width: 556px; overflow-x: auto; opacity: .8; }
.c-course-coach__logos li { display: flex; flex: none; align-items: center; padding-inline: 40px; }
.c-course-coach__logos img { width: auto; }
.c-course-coach__closing { width: 482px; font: 500 14px/20px var(--font-ui); }
.c-course-coach__arrow { position: absolute; top: 50%; display: grid; width: 42px; margin-top: -21px; padding: 0; border: 0; background: none; cursor: pointer; }
.c-course-coach__arrow--prev { left: 0; }
.c-course-coach__arrow--prev img { transform: scaleX(-1); }
.c-course-coach__arrow--next { right: 0; }

/* ---------- calendar ---------- */
.c-course-cal { padding-block: 46px; background: #fff; color: #080808; }
.c-course-cal .c-container { display: flex; justify-content: space-between; gap: 6px; }
.c-course-cal__side { flex: 0 1 486px; min-width: 0; }
.c-course-cal__heading { padding-block: 18px; font: 500 32px/34px var(--font-display); }
.c-course-cal__heading ~ .c-course-cal__heading { margin-top: 54px; }
.c-course-cal__students, .c-course-cal__duration p { position: relative; display: flex; align-items: center; gap: 4px; height: 24px; padding-left: 27px; font: 400 18px/24px var(--font-ui); }
.c-course-cal__students--note { height: auto; }
.c-course-cal__students::before, .c-course-cal__duration p::before { content: ""; position: absolute; top: 50%; left: 12px; width: 5px; height: 5px; margin-top: -2.5px; border-radius: 50%; background: #000; }
.c-course-cal__duration { display: flex; align-items: center; gap: 4px; margin-top: 6px; }
.c-course-cal__num { color: var(--course-wine); font: 500 22px/32px var(--font-display); }
.c-course-cal__months { display: grid; flex: 0 1 660px; gap: 24px; min-width: 0; max-height: 415px; overflow-y: auto; }
.c-course-cal__picker { display: grid; gap: 10px; }
.c-course-cal__month { display: flex; align-items: center; justify-content: space-between; height: 69px; padding-block: 17px 16px; font: 500 22px/32px var(--font-display); }
.c-course-cal__month-name, .c-course-cal__class { color: var(--course-wine); }
.c-course-cal__year { margin-left: 8px; color: rgba(0, 0, 0, .6); }
.c-course-cal__rule { width: 100%; }
.c-course-cal__weekdays, .c-course-cal__week { display: grid; grid-template-columns: repeat(7, 1fr); }
.c-course-cal__weekdays { height: 42.5px; align-items: center; color: rgba(0, 0, 0, .6); font: 400 15.9px/26px var(--font-display); letter-spacing: .53px; text-align: center; }
.c-course-cal__week { margin-bottom: 5px; }
.c-course-cal__day { position: relative; display: grid; width: 42.46px; height: 42.46px; margin-inline: auto; place-items: center; font: 400 18.6px/26.5px var(--font-display); letter-spacing: .33px; }
.c-course-cal__day.is-hidden { visibility: hidden; }
.c-course-cal__day.is-session { z-index: 0; background: var(--course-wine); color: rgba(255, 255, 255, .84); font-weight: 500; }
.c-course-cal__day.is-pill-start { border-radius: 35px 0 0 35px; }
.c-course-cal__day.is-pill-end { border-radius: 0 35px 35px 0; }
.c-course-cal__day.is-pill-single { border-radius: 35px; }
.c-course-cal__day.is-pill-start::after, .c-course-cal__day.is-pill-mid::after { content: ""; position: absolute; top: 0; left: 100%; z-index: -1; width: calc(100% + 18px); height: 100%; background: var(--course-wine); }

/* ---------- gallery ---------- */
.c-course-gallery { padding-block: 31px; background: #fff; color: var(--course-wine); }
.c-course-gallery__title { padding-block: 10px; margin-bottom: 9px; text-align: center; }
.c-course-gallery__grid { display: flex; justify-content: center; gap: 21px; }
.c-course-gallery__large { flex: 0 1 669px; }
.c-course-gallery__side { display: grid; flex: 0 1 318px; align-content: start; gap: 21px; }
.c-course-gallery__large, .c-course-gallery__small { overflow: hidden; border-radius: 8px; }
.c-course-gallery__large img, .c-course-gallery__small img { display: block; width: 100%; }

/* ---------- course variants (numbers read from each Figma frame) ---------- */
.c-course-page--bms { --tab-gap: 21px; --struct-item-pb: 0px; --goal-pt: 107px; --goal-h: 432px; }
.c-course-page--ifs {
  --bg-value: url("../img/course/course-bg-diamond.svg");
  --value-pad: 40px;
  --value-gap: 14px;
  --value-item-pad: 0 0 8px 19px;
  --hero-pt: 128px;
  --hero-pull: 33px;
  --goal-h: 380px;
  --aud-x: -559px;
  --aud-y: -35px;
  --aud-w: 548px;
  --struct-h: 327px;
  --struct-art-x: -630px;
  --struct-art-y: 25px;
  --struct-art-w: 1255px;
  --coach-art-y: -155px;
}
.c-course-page--ceo {
  --value-pad: 69px;
  --hero-pt: 97px;
  --hero-pull: 10px;
  --goal-h: 464px;
  --aud-x: -646px;
  --aud-y: -62px;
  --aud-w: 602px;
  --struct-art-y: 75px;
  --audience-fade: linear-gradient(to top, var(--course-dark), rgba(23, 24, 25, 0) 47.6%, var(--course-dark));
}
.c-course-page--ceo .c-course-audience__list { padding-left: 25.5px; font: 400 17px/1.386 var(--font-ui); }
.c-course-page--ceo .c-course-audience__body { width: min(735px, 100%); padding-inline: 79px; }
.c-course-page--ceo .c-course-struct__panel { grid-template-columns: 118px 64px 1fr; column-gap: 7px; }
.c-course-page--ceo .c-course-struct__num { padding-inline: 12px; }
.c-course-page--ceo .c-course-struct__name { font: 500 32px/34px var(--font-display); }
.c-course-page--ceo .c-course-struct__items li.has-title { padding-left: 0; }
.c-course-page--ceo .c-course-struct__items li.has-title::before { left: -50px; width: 27px; height: 27px; border: 1px solid var(--course-wine); background: none; color: var(--course-wine); font: 400 18px/1.3 var(--font-display); }

/* ---------- below 1024px: stack ---------- */
@media (max-width: 1023px) {
  .c-course-page :where(.c-course-goal__title, .c-course-value__title, .c-course-audience__title, .c-course-struct__title, .c-course-model__title, .c-course-coach__title, .c-course-gallery__title) { font-size: 32px; line-height: 38px; }
  .c-course-hero { padding: 100px 20px 0; }
  .c-course-hero__inner { height: auto; padding-top: 90px; padding-bottom: 40px; margin-bottom: 0; }
  .c-course-hero__title { font-size: 36px; line-height: 40px; white-space: normal; }
  .c-course-top::before { right: auto; left: 50%; width: 900px; margin-left: -450px; }
  .c-course-art--hero { left: 50%; width: 900px; min-width: 0; margin-left: -450px; }
  .c-course-goal { padding-block: 40px; }
  .c-course-value__inner { flex-direction: column; align-items: stretch; gap: 22px; }
  .c-course-value__title { flex: none; padding: 0; }
  .c-course-value__list.has-titles { flex: none; }
  .c-course-page .c-course-value { padding-block: 44px; }
  .c-course-audience { min-height: 440px; justify-content: stretch; padding: 40px 20px; }
  .c-course-art--audience { left: -60px; width: 360px; opacity: .3; }
  .c-course-audience__body, .c-course-page--ceo .c-course-audience__body { width: 100%; margin: 0; padding: 0; }
  .c-course-audience__list { font-size: 18px; line-height: 28px; }
  .c-course-struct { padding: 42px 0; }
  .c-course-struct__body { flex-direction: column; height: auto; gap: 18px; overflow: visible; }
  .c-course-struct__tabs { order: -1; flex-direction: row; gap: 20px; padding: 8px 0 14px; }
  .c-course-struct__tabs { flex: none; overflow: auto hidden; }
  .c-course-struct__tab { flex: 0 0 240px; }
  .c-course-struct__panel { grid-template-columns: 70px 40px 1fr; }
  .c-course-struct__num { font-size: 64px; }
  .c-course-struct__name { font-size: 20px; line-height: 24px; }
  .c-course-struct__content { grid-template-columns: 1fr; }
  .c-course-struct__items { grid-column: 1; }
  .c-course-model__inner { flex-direction: column; align-items: stretch; }
  .c-course-model__intro, .c-course-model__list { flex: none; }
  .c-course-coach { padding-block: 42px; }
  .c-course-art--coach { left: 50%; width: 900px; min-width: 0; margin-left: -450px; }
  .c-course-coach__detail { flex-direction: column; gap: 24px; }
  .c-course-coach__photo { flex: none; width: 300px; height: auto; }
  .c-course-coach__photo img { position: static; width: 100%; }
  .c-course-coach__info { flex: none; width: 100%; }
  .c-course-coach__bio, .c-course-coach__closing, .c-course-coach__logos { width: 100%; }
  .c-course-coach__logos li { padding-inline: 12px; }
  .c-course-coach__arrow { top: 120px; }
  .c-course-cal .c-container { flex-direction: column; gap: 24px; }
  .c-course-cal__side, .c-course-cal__months { flex: none; }
  .c-course-cal__months { max-height: none; }
  .c-course-gallery__grid { flex-direction: column; }
  .c-course-gallery__side { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}