.approved-course--composition-studio {
  --subject-dominant: #f29c45;
  --subject-support: #fff0dc;
  --violet: #f29c45;
  --soft: #fff0dc;
  --coral: #f29c45;
  --course-banner: #f29c45;
  --course-banner-accent: #fff0dc;
  --course-banner-soft: #fff0dc;
}

.approved-course--composition-studio.approved-course--composition-studio button {
  color: #29272d;
}

.arts-hero-art.arts-hero-art {
  inset: 4% -13% -7% -3%;
  width: auto;
  height: auto;
  border: 0;
  border-radius: 46% 39% 0 0 / 34% 42% 0 0;
  background-color: #fff0dc;
  background-image: url('/assets/arts/guider-le-regard-paper-studio.png');
  background-position: 8% 50%;
  background-size: cover;
  box-shadow: inset 0 0 0 8px rgba(255, 240, 220, .34);
  transform: rotate(-2deg);
}

.arts-hero-teacher.arts-hero-teacher {
  width: 108%;
  height: 88%;
  filter: drop-shadow(0 16px 12px rgba(242, 156, 69, .2));
}

.arts-course-entry {
  display: grid;
  grid-template-columns: minmax(0, 1.5fr) minmax(180px, .65fr) minmax(220px, .8fr);
  align-items: center;
  gap: 26px;
  margin: 30px clamp(18px, 4vw, 64px) 0;
  padding: clamp(24px, 4vw, 42px);
  border: 2px solid #f29c45;
  border-radius: 34px;
  background: #fff0dc;
  color: #29272d;
}

.arts-course-entry > div {
  display: grid;
  gap: 12px;
}

.arts-course-entry > div > span,
.arts-course-entry aside > span,
.arts-course-entry aside > small {
  font-family: var(--font-reading);
}

.arts-course-entry > div > span {
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .08em;
}

.arts-course-entry h2 {
  margin: 0;
  font: 800 clamp(34px, 5vw, 64px)/.92 var(--font-display);
}

.arts-course-entry p {
  max-width: 660px;
  margin: 0;
  font: 700 17px/1.5 var(--font-reading);
}

.arts-course-entry button {
  justify-self: start;
  min-height: 50px;
  padding: 0 20px;
  border: 2px solid #29272d;
  border-radius: 18px;
  background: #f29c45;
  color: #29272d;
  font: 800 15px/1.2 var(--font-reading);
  cursor: pointer;
}

.arts-course-entry__teacher {
  display: block;
  width: min(100%, 230px);
  max-height: 260px;
  margin-inline: auto;
  object-fit: contain;
}

.arts-course-entry aside {
  display: grid;
  gap: 8px;
  padding: 22px;
  border: 2px solid #f29c45;
  border-radius: 26px;
  background: #fff8e8;
}

.arts-course-entry aside strong {
  font: 800 30px/1 var(--font-display);
}

.arts-course-entry aside span,
.arts-course-entry aside small {
  font-weight: 700;
  line-height: 1.4;
}

.arts-proof {
  width: min(100%, 760px);
  margin: 0 auto;
  color: #29272d;
}

.arts-proof svg {
  display: block;
  width: 100%;
  height: auto;
  overflow: visible;
}

.arts-paper-stage {
  stroke: rgba(41, 39, 45, .34);
  stroke-width: 1.5;
  stroke-linejoin: round;
  filter: url('#arts-paper-wobble');
}

.arts-proof :where(.arts-moon, .arts-mark) {
  filter: url('#arts-paper-wobble');
}

.arts-proof-grain {
  pointer-events: none;
  mix-blend-mode: multiply;
  opacity: .16;
}

.arts-proof figcaption {
  max-width: 620px;
  margin: 12px auto 0;
  color: #29272d;
  font: 700 15px/1.45 var(--font-reading);
  text-align: center;
}

.kid-summary-example-visual > .arts-proof {
  grid-column: 1 / -1;
  width: 100%;
}

.arts-proof-ground {
  stroke: #29272d;
  stroke-width: 2;
  stroke-linejoin: round;
}

.arts-svg-kicker,
.arts-svg-note,
.arts-process-label,
.arts-proof-key text {
  fill: #29272d;
  font-family: var(--font-reading);
  font-size: 15px;
  font-weight: 800;
  letter-spacing: .04em;
}

.arts-svg-note {
  font-size: 14px;
}

.arts-moon circle:first-child,
.arts-mark {
  stroke: rgba(41, 39, 45, .54);
  stroke-width: 1.5;
}

.arts-look-line,
.arts-path-guide,
.arts-space-brace,
.arts-process-line,
.arts-revision-arrow,
.arts-balance-axis,
.arts-balance-base {
  fill: none;
  stroke: #29272d;
  stroke-width: 3;
  stroke-linecap: round;
}

.arts-look-line,
.arts-space-brace,
.arts-path-guide {
  stroke-dasharray: 8 10;
}

.arts-path-guide {
  opacity: .35;
}

.arts-balance-axis {
  stroke: #2f73d9;
  stroke-dasharray: 9 10;
  opacity: .5;
}

.arts-balance-base {
  stroke: #9267ea;
}

.arts-collage-stitch,
.arts-rhythm-tick {
  fill: none;
  stroke: #29272d;
  stroke-width: 2.5;
  stroke-linecap: round;
  opacity: .72;
}

.arts-value-scale rect {
  stroke: #fff8e8;
  stroke-width: 2;
}

.arts-texture,
.arts-sun-ray {
  fill: none;
  stroke: #2f73d9;
  stroke-width: 3;
  stroke-linecap: round;
}

.arts-sun-ray {
  stroke: #f6cc24;
  stroke-width: 7;
}

.arts-proof-key text {
  font-size: 12px;
}

.arts-process-line {
  stroke: #9267ea;
  stroke-width: 6;
}

.arts-process-number {
  fill: #29272d;
  font-family: var(--font-display);
  font-size: 26px;
  font-weight: 800;
}

.arts-process-label {
  font-size: 12px;
}

.arts-revision-tip {
  fill: none;
  stroke: #29272d;
  stroke-width: 3;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.arts-revision-arrow,
.arts-revision-tip {
  stroke: #f29c45;
  stroke-width: 6;
}

.arts-compose-workspace {
  display: grid;
  gap: 18px;
}

.arts-compose-workspace > section,
.arts-compose-workspace > label {
  display: grid;
  gap: 9px;
}

.arts-compose-workspace > section > span,
.arts-compose-workspace > label > span {
  color: #29272d;
  font: 800 12px/1.25 var(--font-reading);
  letter-spacing: .08em;
}

.arts-compose-choices {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.arts-compose-choices button,
.arts-compose-submit {
  min-height: 48px;
  border: 2px solid #29272d;
  border-radius: 18px;
  background: #fff8e8;
  color: #29272d;
  font: 800 14px/1.2 var(--font-reading);
  cursor: pointer;
}

.arts-compose-choices button.is-selected {
  border-color: #f29c45;
  background: #fff0dc;
  box-shadow: inset 0 0 0 2px #f29c45;
}

.arts-compose-workspace textarea {
  width: 100%;
  min-height: 96px;
  padding: 14px 16px;
  resize: vertical;
  border: 2px solid #f29c45;
  border-radius: 18px;
  background: #fff8e8;
  color: #29272d;
  font: 700 16px/1.45 var(--font-reading);
}

.arts-compose-submit {
  border-color: #f29c45;
  background: #f29c45;
}

.arts-compose-submit:disabled,
.arts-compose-choices button:disabled {
  cursor: not-allowed;
  opacity: .48;
}

.arts-guide-sources {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
  padding: 32px;
  border-radius: 30px;
  background: #fff0dc;
}

.arts-guide-pdf {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 16px 20px;
  border: 2px solid #f29c45;
  border-radius: 22px;
  background: #fff0dc;
  color: #29272d;
}

.arts-guide-pdf > i {
  display: grid;
  width: 42px;
  height: 42px;
  place-items: center;
  border-radius: 50%;
  background: #f29c45;
  color: #29272d;
  font: 800 22px/1 var(--font-display);
}

.arts-guide-pdf > div {
  display: grid;
  gap: 3px;
}

.arts-guide-pdf strong,
.arts-guide-pdf small {
  font-family: var(--font-reading);
}

.arts-guide-sources > header {
  grid-column: 1 / -1;
}

.arts-guide-sources > header span,
.arts-guide-sources article > span {
  color: #29272d;
  font: 800 12px/1.25 var(--font-reading);
  letter-spacing: .08em;
}

.arts-guide-sources h2 {
  margin: 6px 0 0;
  color: #29272d;
  font: 800 clamp(28px, 4vw, 48px)/.95 var(--font-display);
}

.arts-guide-sources article {
  display: grid;
  align-content: start;
  gap: 10px;
  padding: 22px;
  border: 2px solid #f29c45;
  border-radius: 22px;
  background: #fff8e8;
}

.arts-guide-sources article strong,
.arts-guide-sources article p,
.arts-guide-sources article a {
  color: #29272d;
  font-family: var(--font-reading);
}

.arts-guide-sources article strong {
  font-size: 18px;
}

.arts-guide-sources article p {
  margin: 0;
  line-height: 1.45;
}

.arts-guide-sources article a {
  font-weight: 800;
}

.arts-live {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

@media (prefers-reduced-motion: no-preference) {
  .arts-proof--visual-path .arts-mark,
  .arts-proof--composer .arts-mark {
    animation: arts-path-breathe 2.8s ease-in-out infinite;
    animation-delay: calc(var(--mark-index, 0) * 120ms);
  }
}

@keyframes arts-path-breathe {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-3px); }
}

@media (max-width: 760px) {
  .arts-course-entry {
    grid-template-columns: 1fr;
    margin-inline: 14px;
  }

  .arts-course-entry__teacher {
    width: 170px;
  }

  .arts-hero-art.arts-hero-art {
    inset: 0 -1% -4%;
    width: auto;
    height: auto;
    background-position: 8% 50%;
  }

  .arts-proof {
    width: 100%;
  }

  .arts-proof figcaption {
    padding-inline: 6px;
    font-size: 13px;
  }

  .arts-compose-choices,
  .arts-guide-sources {
    grid-template-columns: 1fr;
  }

  .arts-guide-sources {
    padding: 20px;
    border-radius: 24px;
  }

  .arts-guide-sources > header {
    grid-column: auto;
  }
}
