@media(max-width:700px){
 html{scroll-padding-top:84px}
 .shell{padding-inline:20px}
 .catalog-section-intro{padding:32px 20px 0}
 .catalog-grid{padding:25px 20px 0}
 .card-body{padding:20px 24px 22px}
 .ds-card-heading{gap:8px;margin-bottom:20px}
 .ds-card-heading h2{font-size:clamp(21px,5vw,29px)}
 .ds-card-instructor{margin-top:14px}
 .catalog-note{margin-inline:20px;padding:38px 20px 56px}
}
@media(max-width:380px){.ds-card-heading h2{font-size:21px}.ds-intake-status{max-width:103px;font-size:7.5px;padding:6px 7px}}
@media(min-width:701px){
 .catalog-section-intro h1{font-size:clamp(42px,4.102vw,64px);line-height:1.2143;font-weight:800;letter-spacing:normal}
 .catalog-section-intro p,.catalog-note p{font-size:clamp(17px,1.66vw,22px);line-height:1.412}
 .catalog-note h2{font-size:clamp(32px,3.125vw,44px);line-height:1.21;font-weight:800;letter-spacing:normal}
}
@media(min-width:801px),(min-width:480px) and (orientation:landscape){
 .shell{max-width:none;width:100%;padding-inline:clamp(12px,3vw,52px)}
 .catalog-grid{display:flex;flex-direction:column;max-width:1600px;width:100%;gap:18px}
 .course-card{--photo-size:clamp(155px,24vw,260px);display:grid;grid-template-columns:var(--photo-size) minmax(0,1fr);align-items:stretch;min-height:var(--photo-size)}
 .photo{position:relative;min-width:0;min-height:var(--photo-size)}
 .photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
 .card-body{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-rows:auto auto auto auto;align-content:center;align-items:center;gap:9px 16px;padding:18px 24px}
 .card-body>.eyebrow{grid-column:1/-1;grid-row:1;margin:0;font-size:clamp(11px,1.1vw,15px);line-height:1.4;letter-spacing:.08em}
 .ds-card-heading{grid-column:1/-1;grid-row:2;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:8px 15px;margin:0}
 .ds-card-heading h2{font-size:clamp(21px,2.05vw,29px);font-weight:600;line-height:1.38;letter-spacing:normal}
 .ds-intake-status{max-width:100%;font-size:clamp(9px,1.05vw,14px);line-height:1.2;padding:9px 12px}
 .card-body>p{grid-column:1/-1;grid-row:3;max-width:820px;font-size:clamp(14px,1.465vw,18px);line-height:1.4}
 .ds-card-instructor{grid-column:1;grid-row:4;align-self:center;margin:0}
 .ds-instructor-label{font-size:clamp(9px,.88vw,12px);line-height:1.3;letter-spacing:.07em;opacity:.76}
 .ds-instructor-name{font-size:clamp(12px,1.172vw,16px);line-height:1.3}
 .ds-explore-cta{grid-column:2;grid-row:4;justify-self:end;align-self:center;width:auto;min-width:0;min-height:42px;margin:0;padding:10px 18px;background:var(--pink);font-size:clamp(12px,1.1vw,15px);white-space:normal}
}
@media(min-width:1001px){
 .catalog-section-intro{max-width:1600px;width:100%;padding:42px 28px 0}
 .catalog-section-intro p,.catalog-note p{max-width:1100px}
 .catalog-note{max-width:1600px;width:100%;padding:44px 28px 70px}
 .catalog-note .pill{width:max-content;max-width:100%;min-width:240px;min-height:54px;padding:15px 28px;font-size:clamp(17px,1.66vw,22px);font-weight:600}
}
@media(min-width:1001px) and (pointer:fine){.ds-explore-cta{background:transparent;border-color:var(--deep);box-shadow:none}}

/* Computer typography follows dogschkola.de's 1024px ReadyMag canvas.
   Shared tokens scale with the viewport; no upper caps shrink type on wide monitors.
   Touch layouts retain their existing typography and compact card geometry. */
@media(min-width:1001px) and (hover:hover) and (pointer:fine){
 .catalog-section-intro h1{font-size:var(--ds-section);line-height:var(--ds-section-line)}
 .catalog-section-intro p,.catalog-note p,.card-body>p{font-size:var(--ds-copy);line-height:var(--ds-copy-line);font-weight:400}
 .catalog-note h2{font-size:var(--ds-section);line-height:var(--ds-section-line);font-weight:700}
 .card-body>.eyebrow{font-size:var(--ds-small);line-height:var(--ds-small-line);font-weight:600}
 .ds-card-heading h2{font-size:var(--ds-title);line-height:var(--ds-title-line);font-weight:604;letter-spacing:.01953125vw}
 .ds-intake-status{font-size:var(--ds-small);line-height:1.2;font-weight:700}
 .ds-instructor-label{font-size:max(10px,.9765625vw);line-height:var(--ds-small-line);font-weight:600}
 .ds-instructor-name{font-size:var(--ds-small);line-height:var(--ds-small-line)}
 .catalog-note .pill{font-size:var(--ds-copy);font-weight:600;line-height:1;letter-spacing:.09765625vw;min-height:var(--ds-button-height);padding:.78125vw 1.953125vw}
 .ds-explore-cta{font-size:max(17px,1.46484375vw);font-weight:600;line-height:1.2;letter-spacing:.02em;min-height:clamp(46px,3.75vw,56px);padding:8px 20px}
}