/* Header action uses the same spray-painted button as course actions. */
.new-header .header-login{font:400 22px/1 SpriteGraffiti,Arial,sans-serif;min-height:44px;padding:10px 20px;text-decoration:none;white-space:nowrap;color:#fff}
.new-header .brand{min-width:0;max-width:100%}
.new-header .brand img.brand-lockup{min-width:0;max-width:100%;height:auto}

/* The scroll viewport must fit its own grid row, not the old 560px height. */
.course-list-shell{height:clamp(448px,36vw,560px);grid-template-rows:44px minmax(0,1fr) 44px;isolation:isolate}
.course-list-shell .home-course-menu{height:100%;max-height:100%;min-height:0;margin:0;padding:0;scrollbar-gutter:stable;overflow-anchor:none}
.course-list-shell{transform:translateY(-22px)}
.catalog-groups{min-height:126px;align-items:center}
.school-tag{white-space:pre-line}
.faq details p{white-space:pre-line}
.detail-main .course-intro:before{display:none}
.detail-course-cover{width:min(100%,500px);aspect-ratio:1;margin:0 auto 32px;overflow:hidden;background:#16161c}
.detail-course-cover img{display:block;width:100%;height:100%;object-fit:cover;object-position:center}
.course-scroll-arrow{position:relative;z-index:2;min-height:44px;line-height:1;touch-action:manipulation;background:#09090c}
.course-list-shell .course-scroll-arrow[hidden]{display:block;visibility:hidden;pointer-events:none}
.home-course-choice{display:grid;grid-template-columns:minmax(0,1fr) 24px;flex:0 0 auto;min-height:25%;height:auto;font-size:clamp(19px,1.8vw,24px);line-height:1.15;padding:10px 14px}
.home-course-choice .course-choice-title{min-width:0;font:inherit;overflow-wrap:normal}
.home-course-choice .course-choice-arrow{font:400 23px/1 Golos,Arial,sans-serif}

/* Art, shade and caption share the exact same frame at every breakpoint. */
.home-course-panel .home-course-cover{position:relative;aspect-ratio:1;isolation:isolate}
.home-course-panel .home-course-cover>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.home-course-cover:after{content:'';position:absolute;inset:0;z-index:0;pointer-events:none;background:linear-gradient(180deg,transparent 55%,#09090cb8 100%),linear-gradient(90deg,#09090c22,transparent 20%,transparent 80%,#09090c22)}
.home-cover-label{z-index:1;left:0;right:0;bottom:0;background:none;padding:38px 20px 18px;pointer-events:none}

/* Arrows occupy reserved columns instead of floating over the copy. */
.manifesto-foot{display:grid;grid-template-columns:minmax(120px,.7fr) minmax(0,2fr);gap:36px;align-items:center;padding-inline:0}
.manifesto-foot>.school-tag{justify-self:center}
.school-group-carousel{position:relative;display:grid;grid-template-columns:52px minmax(0,1fr) 52px;column-gap:12px;align-items:center;width:100%;min-width:0}
.school-group-controls{display:contents}
.school-group-carousel>[aria-live]{grid-column:2;grid-row:1;min-width:0}
.school-group-controls button,.school-group-controls button:hover{position:relative;top:auto;left:auto;right:auto;transform:none;width:52px;height:52px;min-height:44px;padding:4px;z-index:2;align-self:center;touch-action:manipulation}
.school-group-controls button:first-child{grid-column:1;grid-row:1;left:auto}
.school-group-controls button:last-child{grid-column:3;grid-row:1;right:auto}
.school-group-controls [data-school-direction="-1"]:hover{transform:none}
.school-group-controls svg{pointer-events:none}
.manifesto-foot>.school-tag{min-width:0;max-width:100%;overflow-wrap:anywhere;text-align:center}
.school-group-carousel h3,.school-group-carousel p{overflow-wrap:anywhere;white-space:pre-line}
.school-group-carousel p{font-size:16px;line-height:1.6}

@media(max-width:900px){
 .manifesto-lines .word-note{display:none;left:auto;right:0;max-width:min(220px,65vw);transform:translateY(-8px)}
 .manifesto-lines .morph-word.word-active .word-note,.manifesto-lines .morph-word:focus-within .word-note{display:block;transform:translateY(-8px)}
 .new-header{grid-template-columns:minmax(0,1fr) auto auto}
 .new-header .brand{grid-column:1;grid-row:1}
 .new-header .header-actions{grid-column:2;grid-row:1;gap:0}
 .new-header .menu-toggle{grid-column:3;grid-row:1}
 .new-header .header-actions .header-contact{display:none}
 .home-course-choice{font-size:20px}
}
@media(max-width:760px){
 .new-header .header-login{font-size:21px;padding:9px 12px;min-height:44px}
 .new-header .brand img.brand-lockup{width:100%;max-width:230px}
 .manifesto-foot{grid-template-columns:minmax(0,1fr);gap:22px}
 .school-group-carousel{grid-template-columns:44px minmax(0,1fr) 44px;column-gap:10px}
 .school-group-controls button,.school-group-controls button:hover{width:44px;height:48px;padding:3px}
 .school-group-carousel h3{font-size:28px;line-height:1.2;overflow-wrap:anywhere}
 .school-group-carousel p{font-size:16px;line-height:1.6}
 .school-group-carousel>[aria-live]{min-height:160px}
}
@media(max-width:600px){
 .course-list-shell{transform:none}
 .course-list-shell{height:408px;grid-template-rows:44px minmax(0,1fr) 44px}
 .home-course-choice{font-size:21px;padding:8px 12px}
}
@media(prefers-reduced-motion:reduce){.school-group-controls button{transition:none}}

/* The phone catalogue is a filter and a course, without a nested scroll area. */
.mobile-course-choice, .mobile-course-choice[hidden] { display: none; }
@media (min-width: 901px) {
 .detail-main .course-intro { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1fr); gap: 20px 64px; align-items: start; padding-block: 24px 64px; }
 .detail-course-cover { grid-column: 1; grid-row: 1 / span 3; width: 100%; max-width: 500px; margin: 0; }
 .course-intro .course-byline { grid-column: 2; margin: 0; font-size: 13px; gap: 16px; }
 .course-intro .course-title-row { grid-column: 2; display: flex; flex-direction: column; gap: 28px; }
 .course-intro .course-title-row h1 { max-width: 100%; font-size: clamp(36px,3.6vw,58px); }
 .course-intro .course-purchase { align-items: flex-start; gap: 18px; }
 .course-intro .course-deck { grid-column: 2; margin: 0; font-size: 18px; line-height: 1.6; }
}
@media (max-width: 760px) {
 .home-course-switcher { grid-template-columns: minmax(0,1fr); row-gap: 18px; }
 .catalog-groups {
  display: grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  min-height: 0;
  gap: 4px;
  overflow: visible;
  padding: 0;
  border-bottom: 1px solid #3b3b45;
 }
 .catalog-group {
  min-height: 58px;
  padding: 6px 4px;
  font: 400 13px/1.28 Golos, sans-serif;
  text-transform: none;
  border-bottom: 2px solid transparent;
 }
 .catalog-group[aria-pressed=true] { border-bottom-color: #8294ff; }
 .catalog-group .group-size, .catalog-group .group-ink { display: none; }
 .catalog-group .group-plain, .catalog-group[aria-pressed=true] .group-plain {
  opacity: 1;
  transform: none;
  font: inherit;
  overflow-wrap: normal;
 }
 .catalog-group[aria-pressed=true] .group-plain { font-weight: 700; }
 .home-course-switcher .course-list-shell { display: none; }
 .mobile-course-choice { display: grid; gap: 6px; font: 400 14px/1.4 Golos, sans-serif; }
 .mobile-course-choice select {
  display: block;
  width: 100%;
  min-width: 0;
  min-height: 48px;
  padding: 9px 12px;
  border: 1px solid #555565;
  border-radius: 3px;
  color: #f4f4f5;
  background: #16161c;
  color-scheme: dark;
  font: inherit;
 }
 .home-course-panel:not(.is-selected) { display: none; }
 .home-course-panel.is-selected { gap: 16px; }
 .home-course-panel .home-course-cover { max-width: 460px; }
}