:root {
  color-scheme: light;
  --ink: #172b25;
  --muted: #59655e;
  --paper: #fcfcf8;
  --surface: #fff;
  --line: #dfe5df;
  --yellow: #f5c518;
  --green: #176746;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 7rem; }
body { margin: 0; color: var(--ink); background: var(--paper); font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; font-size: 1rem; line-height: 1.65; }
html[dir="rtl"] body { font-family: "Noto Sans Arabic", Tahoma, Arial, sans-serif; }
a { color: inherit; text-underline-offset: 0.22em; }
button, a, summary { -webkit-tap-highlight-color: transparent; }
a:focus-visible, summary:focus-visible, select:focus-visible { outline: 3px solid var(--green); outline-offset: 3px; }
::selection { color: var(--ink); background: #ffe679; }
img { display: block; max-width: 100%; }
p, h1, h2, h3 { margin: 0; }
h1, h2, h3 { text-wrap: balance; }
.zd-container { width: min(100% - 4rem, 76rem); margin-inline: auto; }
.zd-icon-definitions { position: absolute; width: 0; height: 0; overflow: hidden; }
.zd-visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.zd-icon { width: 1.4rem; height: 1.4rem; flex: 0 0 auto; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
[dir="rtl"] .zd-arrow { transform: rotate(180deg); }
.zd-skip-link { position: fixed; inset-block-start: 0.6rem; inset-inline-start: 1rem; z-index: 100; background: var(--ink); color: #fff; padding: 0.8rem 1.2rem; transform: translateY(-160%); }
.zd-skip-link:focus { transform: translateY(0); }
.zd-landing-header { position: sticky; top: 0; z-index: 20; border-bottom: 1px solid var(--line); background: #fffffff5; backdrop-filter: blur(12px); }
.zd-header-inner { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; min-height: 5.25rem; }
.zd-brand { display: inline-flex; flex-shrink: 0; }
.zd-brand img { width: 11rem; height: 3.25rem; object-fit: contain; }
.zd-main-nav, .zd-header-actions { display: flex; align-items: center; }
.zd-main-nav { gap: 1.7rem; }
.zd-main-nav a { padding-block: 0.7rem; color: var(--muted); text-decoration: none; font-size: 0.9rem; font-weight: 600; }
.zd-main-nav a:hover { color: var(--green); }
.zd-header-actions { flex: 0 0 auto; gap: 0.65rem; flex-wrap: nowrap; }
.zd-language-select { position: relative; display: inline-flex; align-items: center; flex: 0 0 auto; }
.zd-language-select select { width: 4.25rem; min-height: 2.65rem; appearance: none; -webkit-appearance: none; padding: 0.45rem 1.75rem 0.45rem 0.75rem; border: 1px solid var(--line); border-radius: 0.45rem; color: var(--ink); background: #fff; font: inherit; font-size: 0.82rem; font-weight: 750; line-height: 1; cursor: pointer; }
.zd-language-select .zd-icon { position: absolute; right: 0.55rem; width: 0.9rem; height: 0.9rem; pointer-events: none; stroke-width: 2; }
.zd-login { padding: 0.55rem 1rem; border: 1px solid var(--line); border-radius: 0.45rem; font-size: 0.9rem; font-weight: 700; text-decoration: none; white-space: nowrap; }
.zd-login:hover { border-color: var(--ink); }
.zd-hero { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 0.9fr); gap: clamp(2rem, 6vw, 5.5rem); align-items: center; padding-block: 4rem; }
.zd-hero-copy { min-width: 0; }
.zd-eyebrow { display: flex; align-items: center; gap: 0.55rem; color: var(--green); font-size: 0.8rem; font-weight: 750; letter-spacing: 0.1em; line-height: 1.5; }
[dir="rtl"] .zd-eyebrow { letter-spacing: 0; }
.zd-status-dot { height: 0.5rem; width: 0.5rem; border-radius: 50%; background: var(--green); }
.zd-hero h1 { margin-top: 1rem; font-size: clamp(2.4rem, 4vw, 3.6rem); line-height: 1.18; letter-spacing: -0.045em; font-weight: 750; }
.zd-hero h1 span { display: block; margin-top: 0.12em; color: var(--green); }
[dir="rtl"] .zd-hero h1 { font-size: clamp(2.3rem, 3.6vw, 3.25rem); line-height: 1.5; letter-spacing: -0.025em; }
.zd-hero-intro { max-width: 31rem; margin-top: 1.1rem; color: var(--muted); font-size: 1.05rem; line-height: 1.85; }
.zd-hero-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 1.3rem; margin-top: 1.7rem; }
.zd-button { display: inline-flex; align-items: center; justify-content: center; gap: 0.9rem; min-height: 3.4rem; padding: 0.85rem 1.3rem; border: 1px solid transparent; border-radius: 0.45rem; text-decoration: none; font-size: 1rem; font-weight: 750; line-height: 1.5; text-align: center; }
.zd-button-primary { background: var(--yellow); color: #212c23; box-shadow: 0 2px 0 #d5a90c; }
.zd-button-primary:hover { background: #ffda42; }
.zd-button-outline { border-color: #9cac9c; }
.zd-button-outline:hover { background: #fff; }
.zd-text-link { font-size: 0.95rem; font-weight: 650; }
.zd-access-note { max-width: 31rem; margin-top: 1rem; font-size: 0.875rem; color: var(--muted); }
.zd-start-card { padding: 1.75rem; border-radius: 1rem; background: #f0f3ec; scroll-margin-top: 8rem; }
.zd-start-card h2 { font-size: 1.4rem; line-height: 1.5; letter-spacing: -0.02em; text-align: start; }
.zd-start-note { margin-top: 0.35rem; font-size: 0.9rem; color: var(--muted); }
.zd-level-picker { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.3rem; margin-top: 1.25rem; padding: 0.3rem; border: 1px solid #d9e1d4; border-radius: 0.65rem; background: #e5ebdf; }
.zd-level-option { display: flex; align-items: center; justify-content: center; gap: 0.5rem; min-width: 0; min-height: 2.75rem; padding: 0.55rem; border-radius: 0.4rem; color: var(--muted); text-decoration: none; }
.zd-level-option:hover { color: var(--green); background: #f4f7f0; }
.zd-level-option.is-selected { color: #fff; background: var(--green); }
.zd-level-name { font-size: 1rem; font-weight: 750; line-height: 1.4; }
.zd-level-option .zd-icon { width: 1rem; height: 1rem; }
.zd-quick-skills { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.65rem; margin-top: 1rem; }
.zd-quick-skills a { display: flex; align-items: center; gap: 0.65rem; min-width: 0; min-height: 4rem; padding: 0.9rem; border: 1px solid transparent; border-radius: 0.55rem; background: #fff; text-decoration: none; font-size: 0.95rem; font-weight: 650; }
.zd-quick-skills a:hover { color: var(--green); border-color: #a4b99e; background: #fbfdf9; }
.zd-quick-skills .zd-icon { width: 1.2rem; height: 1.2rem; color: var(--green); }
.zd-quick-skills .zd-arrow { width: 0.9rem; height: 0.9rem; margin-inline-start: auto; color: #788779; }
.zd-course-section { position: relative; overflow: hidden; padding-block: clamp(4rem, 8vw, 7rem); color: #fff; background: #18392f; }
.zd-course-section::before { content: ""; position: absolute; inset: -40% auto auto 55%; width: 46rem; height: 46rem; border-radius: 50%; background: radial-gradient(circle, #f5c51824, transparent 67%); pointer-events: none; }
.zd-course-layout { position: relative; display: grid; grid-template-columns: minmax(0, 1.06fr) minmax(22rem, 0.94fr); gap: clamp(3rem, 8vw, 7rem); align-items: center; }
.zd-course-copy { min-width: 0; }
.zd-course-copy .zd-eyebrow { color: #f9d33c; }
.zd-course-section[dir="ltr"] .zd-eyebrow { letter-spacing: 0.1em; }
.zd-course-section[dir="ltr"] .zd-arrow { transform: none; }
.zd-course-section[dir="rtl"] { font-family: "Noto Sans Arabic", Tahoma, Arial, sans-serif; }
.zd-course-pulse { width: 0.55rem; height: 0.55rem; flex-shrink: 0; border-radius: 50%; background: #f5c518; box-shadow: 0 0 0 0 #f5c51866; animation: zd-course-pulse 2s infinite; }
.zd-course-copy h2 { max-width: 18ch; margin-top: 0.9rem; color: #fff; font-size: clamp(2.25rem, 4vw, 3.7rem); line-height: 1.16; letter-spacing: -0.05em; }
.zd-course-section[dir="rtl"] h2 { max-width: 20ch; line-height: 1.55; letter-spacing: -0.025em; }
.zd-course-section[dir="ltr"] h2 { line-height: 1.16; letter-spacing: -0.05em; }
.zd-course-intro { max-width: 42rem; margin-top: 1.25rem; color: #d1ddd7; font-size: 1.05rem; line-height: 1.85; }
.zd-course-list { display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem 1.5rem; margin: 1.8rem 0 0; padding: 0; list-style: none; }
.zd-course-list li { display: flex; align-items: flex-start; gap: 0.65rem; color: #eff5f1; font-size: 0.92rem; line-height: 1.6; }
.zd-course-list .zd-icon { width: 1rem; height: 1rem; margin-top: 0.25rem; color: #f5c518; }
.zd-course-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 1.2rem; margin-top: 2rem; }
.zd-course-actions small { max-width: 19rem; color: #aebfb7; font-size: 0.76rem; line-height: 1.65; }
.zd-course-button { min-height: 3.8rem; max-width: 100%; padding-inline: 0.75rem 1.25rem; color: #162c25; background: #f5c518; box-shadow: 0 4px 0 #b98f00; }
.zd-course-button:hover { background: #ffdb3d; transform: translateY(-1px); }
.zd-course-button:focus-visible { outline-color: #f5c518; }
.zd-course-play { display: grid; place-items: center; flex-shrink: 0; width: 2.35rem; height: 2.35rem; border-radius: 50%; background: #fff8d0; }
.zd-course-play .zd-icon { width: 1.05rem; height: 1.05rem; fill: currentColor; stroke-width: 1.2; }
.zd-course-preview { position: relative; min-height: 28rem; display: grid; place-items: center; isolation: isolate; }
.zd-course-orbit { position: absolute; border: 1px solid #ffffff1d; border-radius: 50%; z-index: -1; }
.zd-course-orbit-one { width: 25rem; height: 25rem; animation: zd-course-orbit 18s linear infinite; }
.zd-course-orbit-two { width: 18rem; height: 18rem; border-style: dashed; animation: zd-course-orbit 12s linear infinite reverse; }
.zd-course-orbit::before, .zd-course-orbit::after { content: ""; position: absolute; width: 0.7rem; height: 0.7rem; border-radius: 50%; background: #f5c518; top: 12%; left: 18%; box-shadow: 0 0 0 6px #f5c51816; }
.zd-course-orbit::after { top: auto; left: auto; right: 3%; bottom: 25%; width: 0.45rem; height: 0.45rem; background: #8bc9b2; box-shadow: 0 0 0 5px #8bc9b218; }
.zd-course-certificate { width: min(19rem, 72vw); min-height: 23rem; display: flex; flex-direction: column; padding: 1.8rem; border: 1px solid #e8ece9; border-inline-start: 0.7rem solid #e4e7e5; border-radius: 0.2rem 0.2rem 1.2rem 0.2rem; color: #1d2d28; background: #fff; box-shadow: 0 35px 65px #071d1740; transform: rotate(3deg); animation: zd-course-card-float 5s ease-in-out infinite; }
.zd-course-certificate > span { color: #75817c; font-size: 0.7rem; font-weight: 700; }
.zd-course-certificate > svg { align-self: flex-end; margin-top: 1.5rem; width: 2rem; height: 2rem; color: #92a39c; }
.zd-course-certificate > strong { margin-top: auto; color: #246c53; font-size: 5.2rem; line-height: 1; letter-spacing: -0.08em; }
.zd-course-certificate > small { margin-top: 0.5rem; color: #78837f; }
.zd-course-certificate > div { display: grid; grid-template-columns: 1fr 1fr; gap: 0.4rem; margin-top: 1.5rem; }
.zd-course-certificate i { padding: 0.45rem; border-radius: 0.35rem; background: #f1f5f2; color: #496158; font-size: 0.65rem; font-style: normal; text-align: center; }
.zd-course-voice, .zd-course-click { position: absolute; padding: 0.7rem 0.95rem; border: 1px solid #ffffff21; border-radius: 999px; color: #fff; background: #274c40e8; box-shadow: 0 12px 25px #071d1733; font-size: 0.72rem; font-weight: 650; backdrop-filter: blur(8px); }
.zd-course-voice { inset-block-start: 11%; inset-inline-start: 1%; }
.zd-course-click { inset-block-end: 13%; inset-inline-end: 0; background: #766120e8; }
@keyframes zd-course-pulse { 70% { box-shadow: 0 0 0 0.7rem #f5c51800; } 100% { box-shadow: 0 0 0 0 #f5c51800; } }
@keyframes zd-course-card-float { 50% { transform: translateY(-0.65rem) rotate(1deg); } }
@keyframes zd-course-orbit { to { transform: rotate(360deg); } }
.zd-practice-section { padding-block: 4.5rem; border-block: 1px solid var(--line); background: #f1f4ed; }
h2 { font-size: clamp(1.8rem, 3vw, 2.45rem); line-height: 1.25; letter-spacing: -0.035em; }
[dir="rtl"] h2 { line-height: 1.6; letter-spacing: -0.025em; }
.zd-section-heading { display: grid; grid-template-columns: 1.2fr 0.8fr; align-items: end; gap: 3rem; margin-bottom: 2.3rem; }
.zd-section-heading h2, .zd-routine > h2, .zd-faq-heading h2 { margin-top: 0.75rem; }
.zd-section-heading > p { max-width: 30rem; color: var(--muted); }
.zd-module-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; }
.zd-module-card { display: flex; flex-direction: column; padding: 1.5rem; background: #fff; border: 1px solid var(--line); border-radius: 0.65rem; }
.zd-module-top { display: flex; align-items: center; justify-content: space-between; gap: 0.5rem; margin-bottom: 1.2rem; }
.zd-module-icon { display: flex; padding: 0.75rem; background: #f3f5ed; color: var(--green); border-radius: 0.5rem; }

.zd-level-tag { color: var(--muted); font-size: 0.8rem; }
.zd-module-card h3 { font-size: 1.4rem; font-weight: 750; line-height: 1.35; }
.zd-module-label { margin-top: 0.2rem; font-size: 0.875rem; color: var(--green); }
.zd-module-description { margin-block: 1.1rem 1.6rem; color: var(--muted); font-size: 1rem; line-height: 1.75; }
.zd-module-link { display: flex; align-items: center; justify-content: space-between; gap: 0.6rem; margin-top: auto; padding-block: 0.5rem; text-decoration: none; color: var(--green); font-size: 0.875rem; font-weight: 700; }
.zd-module-link:hover { text-decoration: underline; }
.zd-module-link .zd-icon { width: 1.1rem; height: 1.1rem; }
.zd-routine { padding-block: 4.75rem; }
.zd-steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 2.5rem; list-style: none; padding: 0; margin: 2.4rem 0 3rem; }
.zd-steps li { border-top: 1px solid var(--line); padding-top: 1.4rem; }
.zd-step-number { display: inline-block; margin-bottom: 1.1rem; font-size: 1rem; font-weight: 700; color: var(--green); font-variant-numeric: tabular-nums; }
.zd-steps h3, .zd-access-panel h3 { font-size: 1.15rem; line-height: 1.5; }
.zd-steps p { color: var(--muted); margin-top: 0.6rem; }
.zd-access-panel { display: flex; align-items: center; justify-content: space-between; gap: 2rem; padding: 1.8rem 2rem; border: 1px solid #d4dec7; border-radius: 0.6rem; background: #edf3e4; }
.zd-access-panel p { max-width: 48rem; margin-top: 0.5rem; font-size: 0.95rem; color: var(--muted); }
.zd-access-panel .zd-button { flex-shrink: 0; max-width: 18rem; }
.zd-faq-section { border-block: 1px solid var(--line); padding-block: 4.75rem; background: #fff; }
.zd-faq-layout { display: grid; grid-template-columns: 0.75fr 1.25fr; gap: 5rem; }
.zd-faq-heading > p:not(.zd-eyebrow) { margin-top: 1.5rem; color: var(--muted); font-size: 0.9rem; }
.zd-faq-heading > a { display: block; width: fit-content; padding-block: 0.4rem; color: var(--green); font-size: 0.9rem; }
.zd-faq-list details { border-bottom: 1px solid var(--line); }
.zd-faq-list details:first-child { border-top: 1px solid var(--line); }
.zd-faq-list summary { display: flex; justify-content: space-between; gap: 1.5rem; align-items: center; list-style: none; padding-block: 1.2rem; font-size: 1rem; font-weight: 700; cursor: pointer; }
.zd-faq-list summary::-webkit-details-marker { display: none; }
.zd-faq-toggle { position: relative; width: 1rem; height: 1rem; flex-shrink: 0; }
.zd-faq-toggle::before, .zd-faq-toggle::after { content: ""; position: absolute; background: var(--green); }
.zd-faq-toggle::before { inset: calc(50% - 1px) 0 auto; height: 2px; }
.zd-faq-toggle::after { inset: 0 auto 0 calc(50% - 1px); width: 2px; }
[open] .zd-faq-toggle::after { display: none; }
.zd-faq-list details > p { color: var(--muted); line-height: 1.85; padding-bottom: 1.3rem; padding-inline-end: 2rem; }
.zd-closing { display: flex; align-items: center; justify-content: space-between; gap: 2rem; padding-block: 4rem; }
.zd-closing h2 { max-width: 42rem; }
.zd-closing p { margin-top: 0.7rem; color: var(--muted); }
.zd-closing .zd-button { flex-shrink: 0; }
.zd-footer { border-top: 1px solid var(--line); background: #f1f4ed; padding-block: 1.8rem 1.4rem; }
.zd-footer-top { display: flex; align-items: center; gap: 1.7rem; }
.zd-footer-top > p { font-size: 0.9rem; color: var(--muted); }
.zd-footer-top > a:last-child { margin-inline-start: auto; font-size: 0.9rem; font-weight: 650; }
.zd-footer-bottom { display: flex; justify-content: space-between; gap: 1.5rem; border-top: 1px solid var(--line); margin-top: 1.3rem; padding-top: 1.2rem; color: var(--muted); font-size: 0.8rem; }
@media (max-width: 1120px) {
  .zd-header-inner { flex-wrap: wrap; gap: 0.25rem 1rem; padding-top: 0.6rem; }
  .zd-brand { order: 1; }
  .zd-header-actions { order: 2; margin-inline-start: auto; }
  .zd-main-nav { order: 3; justify-content: center; width: 100%; gap: 2rem; }
  .zd-main-nav a { padding-block: 0.6rem; }
  .zd-hero { gap: 2rem; }
  .zd-start-card { padding: 1.35rem; }
  .zd-course-layout { grid-template-columns: 1fr; gap: 2.5rem; }
  .zd-course-preview { min-height: 24rem; }
  .zd-module-grid { grid-template-columns: 1fr 1fr; }
  .zd-access-panel { align-items: start; }
  .zd-faq-layout { gap: 3rem; }
}
@media (max-width: 760px) {
  html { scroll-padding-top: 8rem; }
  .zd-container { width: min(100% - 2.5rem, 38rem); }
  .zd-header-inner { width: calc(100% - 2rem); }
  .zd-brand img { width: 8.5rem; height: 2.6rem; }
  .zd-header-actions { gap: 0.5rem; }
  .zd-login { padding: 0.5rem 0.65rem; }
  .zd-main-nav { gap: 1.6rem; }
  .zd-hero { grid-template-columns: 1fr; padding-block: 2.5rem; gap: 1.75rem; }
  .zd-hero h1 { font-size: clamp(2rem, 7vw, 3rem); }
  [dir="rtl"] .zd-hero h1 { font-size: clamp(2rem, 6.5vw, 2.7rem); }
  .zd-hero-intro { font-size: 1rem; }
  .zd-start-card { padding: 1.5rem; }
  .zd-course-section { padding-block: 3.5rem; }
  .zd-course-copy h2 { font-size: 2.3rem; }
  .zd-course-list { grid-template-columns: 1fr; gap: 0.65rem; }
  .zd-course-actions { align-items: flex-start; flex-direction: column; }
  .zd-course-actions small { max-width: 30rem; }
  .zd-course-preview { min-height: 21rem; }
  .zd-course-orbit-one { width: 21rem; height: 21rem; }
  .zd-course-orbit-two { width: 15rem; height: 15rem; }
  .zd-course-certificate { min-height: 19rem; width: min(16rem, 72vw); padding: 1.4rem; }
  .zd-course-certificate > strong { font-size: 4.2rem; }
  .zd-section-heading { grid-template-columns: 1fr; gap: 1rem; }
  .zd-practice-section, .zd-routine, .zd-faq-section { padding-block: 3rem; }
  .zd-steps { grid-template-columns: 1fr; gap: 1.5rem; }
  .zd-steps li { display: grid; grid-template-columns: 2.5rem 1fr; column-gap: 0.7rem; }
  .zd-step-number { grid-row: 1 / 3; margin-bottom: 0; }
  .zd-steps p { grid-column: 2; }
  .zd-access-panel { flex-direction: column; padding: 1.4rem; gap: 1.25rem; }
  .zd-faq-layout { grid-template-columns: 1fr; gap: 1.8rem; }
  .zd-closing { flex-direction: column; align-items: start; padding-block: 3rem; }
  .zd-footer-top { flex-wrap: wrap; gap: 0.7rem 1rem; }
  .zd-footer-top p { order: 3; width: 100%; }
  .zd-footer-bottom { flex-direction: column; gap: 0.5rem; }
}
@media (max-width: 480px) {
  .zd-container { width: calc(100% - 2rem); }
  .zd-header-inner { gap: 0.5rem; padding-block: 0.55rem 0; }
  .zd-brand img { width: 7.35rem; height: 2.35rem; }
  .zd-header-actions { max-width: calc(100% - 7.85rem); gap: 0.35rem; }
  .zd-language-select select { width: 3.75rem; min-height: 2.4rem; padding-inline: 0.65rem 1.45rem; font-size: 0.78rem; }
  .zd-language-select .zd-icon { right: 0.4rem; width: 0.8rem; height: 0.8rem; }
  .zd-login { font-size: 0.8rem; padding: 0.4rem 0.55rem; }
  .zd-main-nav { gap: 1.4rem; }
  .zd-main-nav a { font-size: 0.875rem; }
  .zd-hero-actions { gap: 0.75rem 1rem; }
  .zd-hero-actions .zd-button { min-height: 3rem; padding: 0.7rem 1rem; font-size: 0.9rem; }
  .zd-hero-actions .zd-text-link { font-size: 0.85rem; }
  .zd-start-card { padding: 1.2rem; }
  .zd-start-card h2 { font-size: 1.25rem; }
  .zd-quick-skills { column-gap: 0.7rem; }
  .zd-quick-skills a { gap: 0.5rem; padding: 0.75rem; font-size: 0.875rem; }
  .zd-module-grid { grid-template-columns: 1fr; }
  .zd-module-card { padding: 1.4rem; }
}
@media (max-width: 380px) { .zd-quick-skills .zd-arrow { display: none; } }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
@media (prefers-reduced-motion: reduce) { .zd-course-pulse, .zd-course-orbit, .zd-course-certificate { animation: none; } }

/* Tutorial video: reserve its space and fetch the media only on playback. */
.zd-tutorial-link { display: inline-flex; align-items: center; gap: 0.5rem; }
.zd-tutorial-link .zd-icon { width: 1rem; height: 1rem; }
.zd-tutorial-section { padding-block: 3.5rem; border-top: 1px solid var(--line); background: #fff; }
.zd-tutorial-layout { display: grid; grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.4fr); align-items: center; gap: clamp(2rem, 4vw, 3.5rem); }
.zd-tutorial-copy { min-width: 0; }
.zd-tutorial-copy h2 { margin-top: 0.8rem; }
.zd-tutorial-intro { margin-top: 1rem; color: var(--muted); line-height: 1.85; }
.zd-tutorial-meta { margin-top: 1.2rem; color: var(--green); font-size: 0.875rem; font-weight: 650; }
.zd-tutorial-player { min-width: 0; overflow: hidden; border: 1px solid #d1dcd0; border-radius: 0.8rem; background: #102e24; box-shadow: 0 16px 40px -24px #2c553f55; }
.zd-tutorial-player video { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; background: #102e24; }
.zd-tutorial-player video:focus-visible { outline: 3px solid var(--yellow); outline-offset: -3px; }
@media (max-width: 760px) {
  .zd-tutorial-section { padding-block: 2.5rem; }
  .zd-tutorial-layout { grid-template-columns: 1fr; gap: 1.5rem; }
}

.zd-simulation-section{background:#edf4eb;padding:72px 0;border-block:1px solid #d9e4d6}.zd-simulation-layout{display:flex;align-items:center;justify-content:space-between;gap:48px}.zd-simulation-layout>div{max-width:730px}.zd-simulation-layout h2{font-size:clamp(26px,3vw,40px);line-height:1.25;margin:12px 0 18px;color:#17392a}.zd-simulation-layout p:not(.zd-eyebrow){font-size:17px;line-height:1.8;color:#526559}.zd-simulation-layout .zd-simulation-note{font-size:14px!important}.zd-simulation-layout>.zd-button{flex-shrink:0}@media(max-width:900px){.zd-simulation-section{padding:48px 0}.zd-simulation-layout{align-items:flex-start;flex-direction:column;gap:22px}}

/* Exam practice and plans share the quiet book storefront palette. */
.zd-simulation-section{padding:64px 0;background:#fff}.zd-simulation-card{display:grid;grid-template-columns:1.3fr 1fr;gap:clamp(24px,5vw,80px);align-items:center;padding:clamp(24px,4vw,52px);background:#f1f5ed;border:1px solid #d7e2d4;border-radius:24px}.zd-simulation-content h2{font-size:clamp(30px,3.6vw,48px);line-height:1.3;margin:12px 0 20px}.zd-simulation-content>p:not(.zd-eyebrow){max-width:570px;line-height:1.8;color:#607068}.zd-simulation-content .zd-button{margin-top:12px}.zd-simulation-note{font-size:13px;margin-bottom:0}.zd-simulation-preview{padding:20px;border:1px solid #e0e8dc;border-radius:18px;background:#fff;box-shadow:0 8px 24px #223f2810;min-width:0}.zd-simulation-preview-tag{display:block;font-size:13px;color:#64736a;padding:0 0 14px}.zd-simulation-skill{display:flex;align-items:center;gap:14px;padding:14px 0;border-top:1px solid #e7ede3}.zd-simulation-skill>span{display:grid;place-items:center;background:#f0f5ea;color:#286849;border-radius:11px;width:42px;height:42px}.zd-simulation-skill strong{flex:1;font-size:15px}.zd-simulation-skill>.zd-icon{width:18px;color:#286849}.zd-plans-section{padding:64px 0 72px;background:#fafbf7;border-block:1px solid #e6eade}.zd-plan-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;margin-top:32px}.zd-plan-card{padding:28px;background:#fff;border:1px solid #dce4d7;border-radius:18px;display:flex;flex-direction:column}.zd-plan-card.is-trial{background:#f1f5ed;border-color:#a8c3ae}.zd-plan-terms{font-size:12px;line-height:1.7;color:#607068;margin:0 0 20px}.zd-plan-duration{font-size:16px;font-weight:600;color:#286849;margin:0}.zd-plan-card h3{font-size:46px;line-height:1.3;margin:20px 0 24px;color:#1b3026}.zd-plan-card h3 small{font-size:16px;color:#607068;font-weight:500}.zd-plan-card ul{list-style:none;display:grid;gap:14px;padding:0;margin:0 0 28px;flex:1}.zd-plan-card li{display:flex;gap:10px;align-items:flex-start;font-size:14px;line-height:1.7;color:#52665a}.zd-plan-card li .zd-icon{flex:0 0 18px;margin-top:3px;color:#286849}.zd-plan-card .zd-button{width:100%;justify-content:center}.zd-plan-note{text-align:center;font-size:13px;color:#607068;margin:22px 0 0}
@media(max-width:1100px){.zd-plan-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){.zd-simulation-card{grid-template-columns:1fr}.zd-simulation-section,.zd-plans-section{padding-block:40px}.zd-plan-grid{grid-template-columns:1fr}.zd-plan-card{padding:24px}.zd-plan-card h3{font-size:38px}}