/* A compact first screen for phones, with the course and its next step together. */
.showcase-cta .showcase-cta-label{font-size:inherit;line-height:inherit}
.showcase-cta-price{display:none}
@media(max-width:760px){
  /* Every carousel photograph is 4:3. Preserve the complete frame on phones. */
  .course-showcase{container-type:inline-size;--mobile-photo-height:calc((100vw - 32px) * .75)}
  @supports(width:1cqw){.course-showcase{--mobile-photo-height:calc((100cqw - 32px) * .75)}}
  .course-showcase .container{width:calc(100% - 32px)}
  .showcase-inner{padding:12px 0 0;gap:0}
  .showcase-photo{height:auto;aspect-ratio:4 / 3;max-height:none;border-radius:10px}
  .showcase-photo img{object-fit:contain;object-position:center;transform:none;animation:none}
  .showcase-image-tag{left:10px;bottom:10px;gap:6px;padding:5px 9px;font-size:10px;line-height:1.5;border-radius:4px}
  .showcase-image-tag .icon{width:14px;height:14px}
  .carousel-arrow{top:calc(12px + var(--mobile-photo-height) / 2 - 20px);width:40px;height:40px;box-shadow:0 2px 10px #0002}
  .carousel-prev{left:5px}.carousel-next{right:5px}
  .carousel-arrow .icon{width:19px;height:19px}
  .showcase-copy{padding:14px 0 0}
  .showcase-eyebrow{display:none}
  .showcase-copy #featured-title{font-family:var(--heading);font-size:clamp(24px,7.2vw,28px);font-weight:700;line-height:1.17;letter-spacing:-.7px;min-height:2.34em;max-width:19ch;margin:0 0 7px;text-wrap:balance}
  .showcase-copy .course-instructor{font-size:12px;line-height:1.5;gap:6px;margin:0 0 9px}
  .showcase-copy .course-instructor strong{font-weight:600}
  .showcase-copy>p#featured-description{font-size:15px;line-height:1.45;min-height:0;height:2.9em;max-height:2.9em;max-width:none;margin:0 0 11px;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;overflow:hidden}
  .showcase-meta,.showcase-footnote{display:none}
  .showcase-benefits{display:flex;flex-direction:row;flex-wrap:wrap;gap:5px 15px;margin:0 0 11px}
  .showcase-benefits a{font-size:11px;line-height:1.5;min-height:24px;gap:5px}
  .showcase-benefits .icon{width:15px;height:15px}
  .showcase-pricing{gap:10px;margin:0 0 9px;min-height:24px}
  .showcase-pricing .discount-badge{font-size:10px;line-height:1.5;padding:4px 7px}
  .showcase-pricing del{font-size:13px;line-height:1.5}
  .showcase-purchase{display:block}
  .showcase-purchase>strong{display:none}
  .showcase-cta{width:100%;min-height:48px;display:flex;justify-content:center;align-items:center;gap:9px;padding:12px 16px;border-radius:6px;font-size:16px;font-weight:700;line-height:1.5;background:#142e2d}
  .showcase-cta .showcase-cta-price{display:inline;font-size:inherit;line-height:inherit;font-weight:700}
  .showcase-cta-price::before{content:'·';margin-right:9px;color:#d8d1bd}
  .showcase-cta .icon{width:18px;height:18px;margin-left:3px}
  .showcase-controls{display:flex;justify-content:center;align-items:center;gap:8px;padding:9px 0 10px;min-height:51px}
  .slide-counter{display:none}
  .carousel-dots{display:grid;grid-template-columns:repeat(12,24px);gap:0;flex:0 0 auto}
  .carousel-dot{width:24px;height:28px;min-width:24px;padding:0}
  .carousel-dot::after{width:5px;height:5px}
  .carousel-dot[aria-current=true]::after{width:15px}
  .carousel-pause{width:32px;height:32px;min-width:32px;min-height:32px;margin:0}
  .carousel-pause .icon{width:14px;height:14px}
  .creative-strip{padding-block:11px}
  .creative-strip .marquee-track{font-size:10px;gap:24px}
  .catalog{padding-block:34px}
  .catalog .section-top{margin-bottom:20px}
  .catalog #classes-title,.mentor-copy h2,.certificate-copy h2,.journey h2,.inspiration-heading h2,.faq h2,.closing h2{font-family:var(--heading);font-size:30px;font-weight:700;line-height:1.2;letter-spacing:-.8px}
  .catalog #classes-title em,.mentor-copy h2 em,.certificate-copy h2 em,.journey h2 em,.inspiration-heading h2 em,.faq h2 em,.closing h2 em{font:inherit;letter-spacing:inherit}
  .catalog #classes-title{margin-bottom:12px}
  .section-intro{font-size:14px;line-height:1.6}
  .filters{flex-wrap:nowrap;overflow-x:auto;overscroll-behavior-inline:contain;scroll-snap-type:x proximity;scrollbar-width:thin;padding:2px 0 9px;margin-bottom:17px;gap:8px}
  .filter{flex:0 0 auto;scroll-snap-align:start;min-height:40px;font-size:12px;padding:9px 12px}
  .course-body{padding:18px}
  .course-card .course-card-title{font-size:20px;line-height:1.35}
  .course-instructor{font-size:12px}
  .course-body .course-description{font-size:14px;line-height:1.6}
  .course-meta,.course-benefits{font-size:12px;gap:14px}
  .course-price strong{font-size:25px}
  .course-price{margin-bottom:13px}
  .course-body>.detail-button{min-height:46px}
}
@media(max-width:359px){
  .carousel-dots{display:none}
  .slide-counter{display:block;font-size:12px}
  .showcase-controls{gap:15px;justify-content:space-between}
  .showcase-copy #featured-title{font-size:22px}
  .showcase-benefits{gap:3px 10px}
  .showcase-benefits a{font-size:10px}
}
@media(max-width:760px) and (max-height:650px){
  .showcase-copy{padding-top:11px}
  .showcase-copy #featured-title{margin-bottom:5px}
  .showcase-copy .course-instructor{margin-bottom:6px}
  .showcase-copy>p#featured-description{margin-bottom:7px}
  .showcase-benefits{margin-bottom:7px}
  .showcase-controls{padding-block:7px 6px;min-height:45px}
}