
.course-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin:34px 0 55px}
.course-card{border:1px solid var(--line);padding:30px;background:#fff;display:flex;flex-direction:column}
.course-card h3{margin:17px 0;font-size:clamp(26px,2.6vw,36px);text-transform:uppercase}
.course-card p{color:#51545b;flex:1;margin:0 0 18px}
.course-meta{display:flex;gap:9px;flex-wrap:wrap;margin-bottom:24px}
.course-meta span{border:1px solid #ccd3d6;padding:7px 10px;font-size:12px;font-weight:700}
.course-card .button{align-self:flex-start}
.course-notice{border-left:4px solid var(--blue);background:#eaf4f6;padding:25px 28px;margin:0 0 55px}
.course-notice p{margin-bottom:0}
.course-note{background:#171b20;color:white;padding:34px 38px}
.course-note h3{margin:0 0 18px}.course-note p{color:#d0d1d4;max-width:850px}
.course-detail{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(300px,0.8fr);gap:clamp(30px,5vw,86px);align-items:start}
.course-detail article h2{font-size:clamp(34px,4vw,58px)}
.course-detail article h3{font-size:27px;margin:36px 0 12px}
.course-list{padding-left:24px;margin:20px 0;line-height:1.8}
.course-list li{margin:8px 0}
.course-aside{border-top:5px solid var(--blue);padding:28px;background:#f0f1f2}
.course-aside dl{margin:10px 0 25px}
.course-aside dt{font-size:11px;letter-spacing:.13em;text-transform:uppercase;color:#555;font-weight:700;margin:19px 0 4px}
.course-aside dd{margin:0;font-weight:700;font-family:'Space Grotesk',sans-serif;font-size:18px}
.course-aside dd small{display:block;font:12px 'DM Sans',sans-serif;color:#555;margin:4px 0}
.course-aside .button{width:100%;text-align:center}
.course-hero .container{max-width:1100px}
.course-hero h1{font-size:clamp(45px,6vw,80px);max-width:1000px}
.course-hero .lead{font-size:20px;max-width:780px}
.course-hero-note{font-size:12px;letter-spacing:.08em;color:#d1d3d6;margin-top:24px}
@media(max-width:1200px){.mainnav{display:none;position:absolute;top:78px;left:0;right:0;background:#fff;border-bottom:1px solid #ddd;padding:17px 35px;flex-direction:column;align-items:flex-start}.mainnav.open{display:flex}.nav-toggle{display:block}}
@media(max-width:760px){.course-grid,.course-detail{grid-template-columns:1fr}.course-card{padding:21px}.course-aside{order:-1}.course-note{padding:25px}}
