.sd-site.sd-online-courses { --sd-space-section: clamp(44px, 5vw, 68px); }
.sd-online-courses :where(h1,h2,h3,h4,p,ul,ol,figure) { margin-block: 0; }
.sd-online-courses :where(h1,h2,h3,h4) { text-wrap: balance; }
.sd-online-courses h2 { font-size: clamp(1.7rem, 2.7vw, 2.3rem); line-height: 1.22; }
.sd-online-courses :where(h3,h4) { line-height: 1.35; }
.sd-online-courses h4 { color: var(--sd-dark); font: 700 1rem/1.35 var(--sd-font-heading); letter-spacing: -.02em; }
.sd-online-courses section[id] { scroll-margin-top: 110px; }
.sd-online-courses .sd-eyebrow { margin-bottom: 12px; }
.sd-online-courses .sd-section-heading { margin-bottom: 30px; }
.sd-online-courses .sd-section-heading > p:not(.sd-eyebrow) { margin-top: 14px; color: var(--sd-muted); font-size: .97rem; }
.sd-online-courses svg { fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.sd-online-courses .sd-actions { gap: 12px; }
.sd-online-courses .sd-button { gap: 10px; }
.sd-online-courses a:focus-visible, .sd-online-courses summary:focus-visible { outline-color: var(--sd-dark); }
.sd-online-courses :is(.sd-band--dark,.sd-section--dark) a:focus-visible { outline-color: var(--sd-mint); }
.sd-online-courses .sd-online-note { margin-top: 22px; color: var(--sd-muted); font-size: .87rem; }
.sd-online-courses .sd-online-note a, .sd-online-courses .sd-online-faq__answer a { color: #087a63; }

.sd-online-courses .sd-online-hero { position: relative; isolation: isolate; padding-block: clamp(38px, 5vw, 62px); }
.sd-online-courses .sd-online-hero::before { content: ''; position: absolute; z-index: -1; inset-block: 0; left: 50%; width: 100vw; transform: translateX(-50%); pointer-events: none; background: radial-gradient(ellipse at 86% 35%, rgba(56,216,218,.11), transparent 56%), radial-gradient(circle at 8% 100%, rgba(69,234,194,.07), transparent 30%), linear-gradient(115deg,var(--sd-dark-deep),var(--sd-dark) 58%,#15484b); }
.sd-online-courses .sd-online-hero__layout { display: grid; grid-template-columns: minmax(0,1.3fr) minmax(300px,.9fr); align-items: center; gap: clamp(30px,5vw,72px); }
.sd-online-courses .sd-online-hero h1 { max-width: 740px; font-size: clamp(2rem,3.4vw,3.05rem); line-height: 1.15; }
.sd-online-courses .sd-online-hero .sd-lead { max-width: 640px; margin-top: 20px; font-size: clamp(1rem,1.35vw,1.12rem); }
.sd-online-courses .sd-online-hero .sd-actions { margin-top: 26px; }
.sd-online-courses .sd-online-hero__note { margin-top: 22px; color: #c3ddd8; font-size: .85rem; }
.sd-online-courses .sd-online-session { padding: 22px; border: 1px solid rgba(255,255,255,.22); border-radius: 24px; background: rgba(9,42,47,.45); }
.sd-online-courses .sd-online-session__top { display: flex; justify-content: space-between; align-items: center; gap: 12px; color: #d9eeeb; font-size: .72rem; }
.sd-online-courses .sd-online-session__top > span:first-child { display: flex; align-items: center; gap: 8px; color: var(--sd-white); font: 700 .84rem/1.5 var(--sd-font-heading); }
.sd-online-courses .sd-online-session__top i { width: 7px; height: 7px; border-radius: 50%; background: var(--sd-mint); }
.sd-online-courses .sd-online-session__visual { position: relative; height: 155px; margin-block: 12px 18px; overflow: hidden; }
.sd-online-courses .sd-online-session__orbit { position: absolute; left: 50%; top: 14px; width: 210px; height: 210px; transform: translateX(-50%); border: 1px solid rgba(69,234,194,.17); border-radius: 50%; box-shadow: 0 0 0 23px rgba(69,234,194,.035); }
.sd-online-courses .sd-online-session__person { position: absolute; z-index: 1; display: grid; place-items: center; border-radius: 24px; }
.sd-online-courses .sd-online-session__person--teacher { left: calc(50% - 112px); top: 24px; width: 102px; height: 102px; color: var(--sd-dark); background: var(--sd-mint); }
.sd-online-courses .sd-online-session__person--student { left: calc(50% + 20px); top: 73px; width: 78px; height: 78px; border: 1px solid #86bdb4; color: #d9eeeb; background: #20545a; }
.sd-online-courses .sd-online-session__bubble { position: absolute; z-index: 2; left: calc(50% + 27px); top: 12px; color: var(--sd-mint); }
.sd-online-courses .sd-online-session__connection { position: absolute; left: calc(50% - 11px); top: 89px; width: 35px; height: 2px; background: var(--sd-mint); transform: rotate(23deg); }
.sd-online-courses .sd-online-session__facts { list-style: none; padding: 0; margin: 0; }
.sd-online-courses .sd-online-session__facts li { display: grid; grid-template-columns: 26px minmax(0,1fr); gap: 12px; align-items: baseline; padding-block: 12px; border-top: 1px solid rgba(255,255,255,.14); }
.sd-online-courses .sd-online-session__facts li:last-child { padding-bottom: 0; }
.sd-online-courses .sd-online-session__facts span { color: var(--sd-mint); font: 600 .72rem/1.5 var(--sd-font-heading); }
.sd-online-courses .sd-online-session__facts strong { color: var(--sd-white); font: 600 .89rem/1.5 var(--sd-font-heading); }

.sd-online-courses .sd-online-intro { display: grid; grid-template-columns: minmax(0,1.1fr) minmax(0,.9fr); gap: 28px 70px; align-items: end; margin-bottom: 32px; }
.sd-online-courses .sd-online-intro > p { color: var(--sd-muted); font-size: .95rem; }
.sd-online-courses .sd-online-steps { list-style: none; margin: 0; padding: 0; gap: 32px; }
.sd-online-courses .sd-online-steps li { padding-top: 22px; border-top: 1px solid var(--sd-line); }
.sd-online-courses .sd-online-step-number { display: block; margin-bottom: 13px; color: #087a63; font: 700 .8rem/1.5 var(--sd-font-heading); }
.sd-online-courses .sd-online-steps h3 { font-size: 1.1rem; }
.sd-online-courses .sd-online-steps p { margin-top: 10px; color: var(--sd-muted); font-size: .91rem; }

.sd-online-courses .sd-online-course-group + .sd-online-course-group { margin-top: 34px; }
.sd-online-courses .sd-online-group-heading { display: flex; justify-content: space-between; align-items: baseline; gap: 12px 26px; margin-bottom: 17px; }
.sd-online-courses .sd-online-group-heading h3 { font-size: 1.12rem; }
.sd-online-courses .sd-online-group-heading p { color: var(--sd-muted); font-size: .85rem; }
.sd-online-courses .sd-online-course-grid { gap: 16px; }
.sd-online-courses .sd-online-course-card { display: grid; grid-template-columns: 42px minmax(0,1fr) 18px; gap: 13px; align-items: start; padding: 23px 20px; color: var(--sd-ink); text-decoration: none; box-shadow: none; transition: transform .22s ease,border-color .22s ease,box-shadow .22s ease; }
.sd-online-courses .sd-online-course-card__code { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 12px; background: #e8f7f1; color: #087a63; font: 700 .82rem/1 var(--sd-font-heading); }
.sd-online-courses .sd-online-course-card p { margin-top: 8px; color: var(--sd-muted); font-size: .82rem; line-height: 1.6; }
.sd-online-courses .sd-online-arrow { color: #087a63; font-size: 1.14rem; line-height: 1.3; transition: transform .22s ease; }
.sd-online-courses .sd-online-course-card--professional .sd-online-course-card__code { background: var(--sd-dark); color: var(--sd-mint); }
.sd-online-courses .sd-online-course-card:focus-visible { border-color: #087a63; box-shadow: var(--sd-shadow-card); transform: translateY(-4px); }
.sd-online-courses .sd-online-course-card:focus-visible .sd-online-arrow { transform: translate(2px,-2px); }
.sd-online-courses .sd-online-format-card { padding: 28px; box-shadow: none; transition: transform .22s ease,border-color .22s ease,box-shadow .22s ease; }
.sd-online-courses .sd-online-format-card__icon { display: block; color: #087a63; margin-bottom: 16px; }
.sd-online-courses .sd-online-format-card h3 { font-size: 1.22rem; }
.sd-online-courses .sd-online-format-card > p { margin-top: 12px; color: var(--sd-muted); font-size: .94rem; }
.sd-online-courses .sd-online-format-card ul { display: flex; flex-direction: column; gap: 8px; margin-top: 20px; padding-left: 20px; font-size: .88rem; }
.sd-online-courses .sd-online-format-card li::marker { color: #087a63; }
@media (hover:hover) and (pointer:fine) {
  .sd-online-courses :is(.sd-online-course-card,.sd-online-format-card):hover { transform: translateY(-4px); border-color: #087a63; box-shadow: var(--sd-shadow-card); }
  .sd-online-courses .sd-online-course-card:hover .sd-online-arrow { transform: translate(2px,-2px); }
}

.sd-online-courses .sd-online-choice__layout { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: clamp(32px,6vw,80px); }
.sd-online-courses .sd-online-choice__layout > div > p:not(.sd-eyebrow) { margin-top: 18px; max-width: 500px; color: var(--sd-muted); font-size: .95rem; }
.sd-online-courses .sd-online-benefits { list-style: none; padding: 0; margin: 0; }
.sd-online-courses .sd-online-benefits li { display: grid; grid-template-columns: 35px minmax(0,1fr); gap: 16px; padding-block: 19px; border-bottom: 1px solid var(--sd-line); }
.sd-online-courses .sd-online-benefits li:first-child { padding-top: 0; }
.sd-online-courses .sd-online-benefits li:last-child { border: 0; padding-bottom: 0; }
.sd-online-courses .sd-online-benefits li > span { display: grid; place-items: center; width: 35px; height: 35px; border: 1px solid #bcded7; border-radius: 50%; color: #087a63; }
.sd-online-courses .sd-online-benefits h3 { font-size: 1.08rem; }
.sd-online-courses .sd-online-benefits p { margin-top: 7px; color: var(--sd-muted); font-size: .88rem; }
.sd-online-courses .sd-online-equipment__grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 24px; list-style: none; padding: 0; margin: 0; }
.sd-online-courses .sd-online-equipment__grid li { padding: 24px 0 0; border-top: 1px solid var(--sd-line); }
.sd-online-courses .sd-online-equipment__grid svg { display: block; margin-bottom: 15px; color: #087a63; }
.sd-online-courses .sd-online-equipment__grid h3 { font-size: 1.05rem; }
.sd-online-courses .sd-online-equipment__grid p { margin-top: 10px; color: var(--sd-muted); font-size: .88rem; }
.sd-online-courses .sd-online-equipment__note { margin-top: 28px; padding: 18px 22px; border-left: 3px solid #087a63; border-radius: 0 12px 12px 0; background: var(--sd-soft); }
.sd-online-courses .sd-online-equipment__note strong { color: var(--sd-dark); font: 700 .91rem/1.5 var(--sd-font-heading); }
.sd-online-courses .sd-online-equipment__note p { margin-top: 6px; color: var(--sd-muted); font-size: .86rem; }

.sd-online-courses .sd-online-live__layout { display: grid; grid-template-columns: minmax(0,1.15fr) minmax(0,1fr); gap: clamp(30px,6vw,80px); align-items: center; }
.sd-online-courses .sd-online-live .sd-lead { margin-top: 18px; font-size: 1rem; }
.sd-online-courses .sd-online-live__note { margin-top: 20px; padding-top: 17px; border-top: 1px solid rgba(255,255,255,.18); color: #c3ddd8; font-size: .86rem; }
.sd-online-courses .sd-online-live__examples { display: grid; gap: 20px; }
.sd-online-courses .sd-online-live__examples article { padding-left: 22px; border-left: 2px solid var(--sd-green); }
.sd-online-courses .sd-online-live__examples span { display: block; margin-bottom: 8px; color: var(--sd-mint); font: 700 .7rem/1.4 var(--sd-font-heading); text-transform: uppercase; letter-spacing: .09em; }
.sd-online-courses .sd-online-live__examples h3 { font-size: 1.13rem; }
.sd-online-courses .sd-online-live__examples p { margin-top: 9px; color: #d9eeeb; font-size: .88rem; }
.sd-online-courses .sd-online-faq__layout { display: grid; grid-template-columns: minmax(0,.8fr) minmax(0,1.3fr); gap: clamp(30px,6vw,80px); }
.sd-online-courses .sd-online-faq__layout > div:first-child > p:not(.sd-eyebrow) { margin-top: 17px; color: var(--sd-muted); font-size: .95rem; }
.sd-online-courses .sd-online-text-link { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; margin-top: 13px; color: #087a63; font: 700 .9rem/1.5 var(--sd-font-heading); text-decoration: underline; }
.sd-online-courses .sd-online-text-link:hover { color: var(--sd-dark); }
.sd-online-courses .sd-online-faq__items { border-top: 1px solid var(--sd-line); }
.sd-online-courses .sd-online-faq details { border-bottom: 1px solid var(--sd-line); }
.sd-online-courses .sd-online-faq summary { position: relative; padding: 19px 36px 19px 0; color: var(--sd-dark); font: 700 .96rem/1.5 var(--sd-font-heading); cursor: pointer; list-style: none; }
.sd-online-courses .sd-online-faq summary::-webkit-details-marker { display: none; }
.sd-online-courses .sd-online-faq summary::after { content: '+'; position: absolute; right: 3px; top: 18px; color: #087a63; font-size: 1.3rem; }
.sd-online-courses .sd-online-faq details[open] summary::after { content: '−'; }
.sd-online-courses .sd-online-faq summary:hover { color: #087a63; }
.sd-online-courses .sd-online-faq__answer { padding: 0 20px 19px 0; color: var(--sd-muted); font-size: .91rem; }
.sd-online-courses .sd-online-final { padding-bottom: clamp(40px,5vw,64px); }
.sd-online-courses .sd-online-final__panel { display: grid; grid-template-columns: minmax(0,1.25fr) minmax(0,1fr); gap: 28px; align-items: center; padding: clamp(26px,3.5vw,40px); border-radius: var(--sd-radius-card); }
.sd-online-courses .sd-online-final h2 { font-size: clamp(1.5rem,2.3vw,2rem); }
.sd-online-courses .sd-online-final p:not(.sd-eyebrow) { margin-top: 12px; color: #d9eeeb; font-size: .92rem; }
.sd-online-courses .sd-online-final .sd-actions { justify-content: flex-end; }

@media (max-width:1000px) {
  .sd-online-courses .sd-online-hero__layout { grid-template-columns: minmax(0,1.15fr) minmax(275px,.85fr); gap: 32px; }
  .sd-online-courses .sd-online-course-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .sd-online-courses .sd-online-final__panel { grid-template-columns: minmax(0,1fr); }
  .sd-online-courses .sd-online-final .sd-actions { justify-content: flex-start; }
}
@media (max-width:800px) {
  .sd-online-courses :is(.sd-online-intro,.sd-online-choice__layout,.sd-online-live__layout,.sd-online-faq__layout) { grid-template-columns: minmax(0,1fr); gap: 28px; }
  .sd-online-courses .sd-online-steps { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 20px; }
  .sd-online-courses .sd-online-equipment__grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .sd-online-courses .sd-online-group-heading { flex-direction: column; gap: 5px; }
}
@media (max-width:700px) {
  .sd-online-courses .sd-online-hero__layout { grid-template-columns: minmax(0,1fr); }
  .sd-online-courses .sd-online-session { max-width: 500px; width: 100%; }
  .sd-online-courses .sd-online-session__visual { height: 122px; margin-block: 5px 12px; }
  .sd-online-courses .sd-online-session__person--teacher { top: 14px; width: 90px; height: 90px; }
  .sd-online-courses .sd-online-session__person--student { top: 49px; width: 72px; height: 72px; }
  .sd-online-courses .sd-online-session__connection { top: 65px; left: calc(50% - 22px); width: 48px; }
  .sd-online-courses .sd-online-session__bubble { top: 3px; }
}
@media (max-width:600px) {
  .sd-site.sd-online-courses { --sd-space-section: 40px; font-size: 16px; }
  .sd-online-courses .sd-online-hero { padding-block: 30px 34px; }
  .sd-online-courses .sd-online-hero h1 { font-size: clamp(1.85rem,7.3vw,2.5rem); }
  .sd-online-courses .sd-online-hero .sd-lead { margin-top: 17px; }
  .sd-online-courses .sd-online-hero__note { font-size: .82rem; }
  .sd-online-courses .sd-actions { width: 100%; align-items: stretch; }
  .sd-online-courses .sd-actions .sd-button { width: 100%; }
  .sd-online-courses :is(.sd-online-course-grid,.sd-online-steps) { grid-template-columns: minmax(0,1fr); }
  .sd-online-courses .sd-online-steps { gap: 22px; }
  .sd-online-courses .sd-online-steps li { position: relative; padding-left: 44px; padding-top: 17px; }
  .sd-online-courses .sd-online-step-number { position: absolute; top: 18px; left: 0; }
  .sd-online-courses .sd-online-course-card { padding: 20px; }
  .sd-online-courses .sd-online-course-group + .sd-online-course-group { margin-top: 28px; }
  .sd-online-courses .sd-online-format-card { padding: 24px; }
  .sd-online-courses .sd-online-equipment__grid { gap: 22px 18px; }
  .sd-online-courses .sd-online-equipment__grid h3 { font-size: 1rem; }
  .sd-online-courses .sd-online-session { padding: 18px; border-radius: 18px; }
  .sd-online-courses .sd-online-final__panel { padding: 26px 22px; }
}
@media (prefers-reduced-motion:reduce) {
  .sd-online-courses :is(.sd-online-course-card,.sd-online-format-card,.sd-online-arrow) { transition: none; }
  .sd-online-courses :is(.sd-online-course-card,.sd-online-format-card):is(:hover,:focus-visible),
  .sd-online-courses .sd-online-course-card:is(:hover,:focus-visible) .sd-online-arrow { transform: none; }
}