/* Enthy — quiet light, glass controls, solid reading surfaces.
   Shared by the public site, course preview and learning workspace. */
:root {
  --sans: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --plane: #f9fcfc; --ink: #143238; --ink-2: #415e64; --ink-3: #586e74; --ink-4: #71858a;
  --accent: #14666b; --accent-dim: #e0eeed; --muted: var(--ink-2);
  --rule: #173b4414; --rule-2: #173b4429; --glass-edge: #fff9; --glass-edge-strong: #37646c42;
  --glass: #ffffffa6; --glass-active: #fffffff2; --surface-2: #17434e09;
  --rail-hover: #ffffff70; --rail-active: #ffffffc9;
  --radius: 26px; --radius-s: 14px;
  --frost: #ffffffa8; --reading: #fbfdfdf5; --edge: #ffffffe0;
  --depth: 0 14px 42px #234c5910, inset 0 1px 0 #fff;
  --float-depth: 0 18px 55px #234c591a, inset 0 1px 0 #fff;
  --merqen-ivory: #f2f7f7; --merqen-paper: #fbfdfd; --merqen-petrol: #143b42;
  --merqen-petrol-2: #326c73; --merqen-ink: #143238; --merqen-muted: #526c73;
  --merqen-line: #234c5926; --merqen-lime: #e0edbb; --merqen-saffron: #5e8987;
  --course-ivory: #f2f7f7; --course-paper: #fbfdfd; --course-petrol: #143b42;
  --course-petrol-2: #326c73; --course-ink: #143238; --course-muted: #526c73;
  --course-line: #234c5926; --course-lime: #e0edbb; --course-saffron: #5e8987;
}
html { background: #edf5f6; }
body.startseite, body.kursseite, body.enthy-learning, body.enthy-info, body.enthy-builder {
  background: linear-gradient(#f5faf980, #f4f8f9ed), url('/static/enthy-soft-frost.webp') center top / cover fixed;
  color: var(--ink); font-family: var(--sans); font-size: 16px;
}
:focus-visible { outline: 3px solid var(--accent); outline-offset: 4px; }
::selection { background: #b9dcd8; color: #12393c; }
.btn, .button, .chip, .opt, .course-button { touch-action: manipulation; }

/* A floating navigation layer above a quiet content field. */
.site-header, .course-header, .enthy-info > header {
  position: sticky; top: 16px; z-index: 30; min-height: 68px;
  width: min(1180px, calc(100% - 48px)); margin: 16px auto 0; padding: 10px 20px;
  border: 1px solid var(--edge); border-radius: 999px; background: var(--frost);
  box-shadow: var(--float-depth); backdrop-filter: blur(24px) saturate(130%);
  -webkit-backdrop-filter: blur(24px) saturate(130%);
}
.site-header { gap: 24px; }
.site-nav { gap: 24px; }
.site-nav a, .text-link, .course-back { font-size: .875rem; }
.wordmark, .course-brand, .enthy-info .wordmark { font: 700 24px/1.2 var(--sans); letter-spacing: -.065em; }
.wordmark-mark, .course-brand-mark { width: 34px; height: 34px; border-radius: 50%; background: linear-gradient(145deg, #3a767b, #143b42); color: #fff; box-shadow: inset 0 1px 0 #ffffff70, 0 4px 12px #153b3f24; }
.button, .course-button { min-height: 48px; font-size: .9rem; font-weight: 600; }
.button-primary, .button-dark, .course-button-primary {
  background: linear-gradient(150deg, #347279, #143b42); color: #fff !important;
  border: 1px solid #ffffff30; box-shadow: inset 0 1px #ffffff45, 0 6px 16px #173f4626;
}
.button-quiet, .art-float, .visual-float, .signal-row, .course-meta span {
  background: var(--frost); border: 1px solid var(--edge); box-shadow: var(--depth);
  backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px);
}
.button:hover { transform: translateY(-1px); }

/* Marketing: less ornament, stronger typography and breathing room. */
.startseite :is(h1,h2,h3,.art-title,.demo-question,.price-number,.price-plus),
.kursseite :is(h1,h2,h3,.course-headline-subtitle,.visual-title), .enthy-info h1 {
  font-family: var(--sans); font-weight: 600; letter-spacing: -.055em;
}
.startseite h1 em, .startseite h2 em, .kursseite h1 em, .kursseite h2 em { font-family: inherit; font-style: normal; color: #52787f; }
.hero { min-height: 720px; padding: 90px 0 105px; gap: clamp(40px, 6vw, 85px); }
.startseite section[id] { scroll-margin-top: 105px; }
.hero h1 { font-size: clamp(3.5rem, 5.7vw, 5.65rem); line-height: 1.04; letter-spacing: -.07em; text-wrap: balance; }
.hero-lead { font-size: 1.06rem; line-height: 1.8; max-width: 490px; color: var(--ink-2); }
.hero-note { font-size: .82rem; color: var(--ink-2); }
.hero .eyebrow { display: inline-flex; padding: 8px 13px; border: 1px solid var(--edge); border-radius: 999px; background: #ffffff80; font-size: .7rem; letter-spacing: .08em; }
.eyebrow-dot { background: #548988; box-shadow: 0 0 0 4px #54898815; }
.hero-art { min-height: 500px; }
.art-backdrop, .course-disc { border-radius: 42px; background: linear-gradient(140deg, #ffffff85, #c5e3e440); border: 1px solid var(--edge); box-shadow: var(--float-depth); transform: rotate(-4deg); }
.art-backdrop::after, .course-disc::after { display: none; }
.art-window, .course-card-visual { border-radius: 26px; border: 1px solid var(--edge); background: #fbfdfdef; box-shadow: var(--float-depth); transform: none; }
.art-content { padding: 35px 30px; }
.art-title { line-height: 1.14; font-size: 1.85rem; }
.art-bar, .art-rail { background: #ffffff50; }
.art-rail .rail-active { background: #b8d8d4; box-shadow: none; }
.art-options span { border-radius: 10px; }
.art-options .art-selected { background: #e0eeeb; }
.art-float, .visual-float { border-radius: 17px; padding: 14px 16px; transform: none; }
.art-float-a { left: -3%; top: 1%; }.art-float-b { right: -1%; bottom: 2%; }
.art-float b { font-size: .78rem; }.art-float small { font-size: .7rem; }
.signal-row { border-radius: 24px; padding: 22px; font-size: .8rem; }
.signal-row span { font-size: .8rem; }
.intro-section { padding-top: 105px; }
.intro-grid h2, .demo-intro h2, .workflow-heading h2, .trust-copy h2, .pricing-heading h2, .interest-copy h2, .faq-heading h2 { font-size: clamp(2.2rem, 3.6vw, 3.5rem); line-height: 1.13; }
.outcome-cards { gap: 20px; }
.outcome-card, .price-card, .interest-card, .preview-summary, .purchase-card, .course-error-card {
  background: var(--reading); border: 1px solid var(--edge); border-radius: 28px; box-shadow: var(--depth);
}
.outcome-card { padding: 30px; }
.outcome-card-dark { background: linear-gradient(140deg, #32656e, #183d44); color: #f4fbfb; }
.outcome-card-dark p { color: #d5e5e5; }
.outcome-card-accent { background: #eff6f3eb; }
.outcome-card p, .intro-aside p, .demo-intro p, .workflow-heading p, .workflow-list p, .pricing-heading > p { font-size: 1rem; }
.outcome-card:not(.outcome-card-dark) p { color: var(--ink-2); }
.demo-shell { border: 1px solid #ffffff80; border-radius: 30px; background: #183f46; box-shadow: 0 24px 70px #21495120; }
.demo-option { border-radius: 14px; min-height: 58px; font-size: 1rem; }
.demo-question { line-height: 1.3; }
.workflow-list { gap: 18px; }
.workflow-list li, .workflow-list li + li { padding: 25px; border: 1px solid var(--edge); border-radius: 24px; background: #ffffff85; }
.workflow-line { display: none; }.step-mark { right: 20px; top: 20px; }
.trust-panel { border-radius: 32px; background: linear-gradient(135deg, #2c616a, #12343c); }
.price-card-featured { background: linear-gradient(145deg, #f4f9ee, #fbfdfd); }
.price-card-plus { background: #edf5f5ef; }
.price-badge { background: #e2edcb; color: #334c28; }
.price-list li { font-size: .94rem; }
.form-field input { border-radius: 14px; min-height: 52px; background: #ffffffcf; }
.faq-list summary { font-family: var(--sans); font-size: 1.08rem; min-height: 68px; }
.site-footer { margin: 16px; border-radius: 32px; background: #163c44; }
.course-disc { border-radius: 38px; }.course-card-visual { inset: 7% 3%; }
.course-hero > div { min-width: 0; }
.course-hero h1 { line-height: 1.05; overflow-wrap: anywhere; hyphens: auto; }.course-rail { background: #ffffff70; border: 1px solid var(--edge); border-radius: 20px; }
.preview-question { border-radius: 22px; }.visual-float { backdrop-filter: blur(18px); }
.course-dek, .course-section-head > p, .purchase-reassurance p { font-size: 1rem; }
.enthy-info article { background: var(--reading); padding: 32px; border: 1px solid var(--edge); border-radius: 26px; box-shadow: var(--depth); }
.enthy-info h1 { line-height: 1.1; }.enthy-info aside a[aria-current] { background: var(--frost); box-shadow: var(--depth); }

.creator-inline { display: inline-flex; align-items: center; gap: 12px; font-size: .84rem; color: var(--accent); text-decoration: underline; text-underline-offset: 5px; padding: 10px 0; }
.creator-invitation { display: grid; grid-template-columns: 1.1fr 1fr; gap: 72px; align-items: center; padding-top: 100px; padding-bottom: 70px; }
.creator-invitation h2 { font-size: clamp(2.2rem,3.6vw,3.5rem); line-height: 1.13; margin: 20px 0; }
.creator-invitation-copy > p { font-size: 1rem; line-height: 1.8; color: var(--ink-2); margin-bottom: 24px; max-width: 480px; }
.creator-invitation-copy > .creator-caption { font-size: .76rem; margin-top: 14px; }
.creator-path { border: 1px solid var(--edge); border-radius: 30px; padding: 36px; background: linear-gradient(145deg,#ffffffc9,#dfedebcc); box-shadow: var(--float-depth); }
.creator-path-label { font-size: .66rem; letter-spacing: .1em; color: var(--ink-2); }
.creator-path ol { padding: 0; margin: 22px 0 0; list-style: none; }
.creator-path li { display: flex; gap: 20px; align-items: center; padding: 22px 0; border-bottom: 1px solid var(--rule); }
.creator-path li:last-child { border: 0; padding-bottom: 0; }
.creator-path li > span { display: grid; place-items: center; flex-shrink: 0; width: 42px; height: 42px; border-radius: 14px; background: #ffffffb3; border: 1px solid var(--edge); font-size: .75rem; color: var(--accent); }
.creator-path strong, .creator-path small { display: block; }.creator-path strong { font-size: 1rem; font-weight: 600; }.creator-path small { margin-top: 7px; line-height: 1.6; color: var(--ink-2); font-size: .83rem; }
@media(max-width:720px) { .creator-invitation { grid-template-columns: 1fr; gap: 28px; padding-top: 65px; padding-bottom: 40px; }.creator-path { padding: 26px; } }

/* Learning workspace: frosted chrome, with calm opaque reading cards. */
body.enthy-learning { height: 100dvh; min-height: 0; --navw: 282px; }
body.enthy-learning.nav-closed { --navw: 0px; }
.enthy-learning > main { grid-column: 2; grid-row: 1; margin: 16px; border: 1px solid var(--edge); border-radius: 28px; background: #ffffff60; box-shadow: var(--float-depth); }
.enthy-learning > aside { margin: 16px 0 16px 16px; border: 1px solid var(--edge); border-radius: 26px; background: var(--frost); box-shadow: var(--depth); backdrop-filter: blur(24px); }
.enthy-learning.nav-closed > aside { margin: 0; border: 0; visibility: hidden; }
.enthy-learning header { min-height: 78px; padding: 14px 20px; background: var(--frost); border-bottom: 1px solid var(--edge); backdrop-filter: blur(24px); -webkit-backdrop-filter: blur(24px); }
.enthy-learning header h2 { font-size: 1rem; font-weight: 600; letter-spacing: -.025em; }
.enthy-learning .brand { padding: 22px 18px 18px; align-items: center; }
.enthy-learning .brand h1 { font-size: 22px; letter-spacing: -.055em; }
.enthy-learning .cdown { font-size: 12px; }
.enthy-learning .modes { border: 1px solid var(--edge); border-radius: 999px; padding: 4px; background: #64848c10; gap: 3px; }
.enthy-learning .modes button { min-height: 38px; padding: 7px 14px; font-size: .875rem; border-radius: 999px; }
.enthy-learning .modes button.on { background: var(--glass-active); box-shadow: 0 3px 9px #21475016, inset 0 1px #fff; color: var(--accent); }
.enthy-learning :is(.navtoggle,.tbtn) { height: 40px; width: 40px; border-radius: 50%; background: var(--glass); font-size: 16px; }
.enthy-learning #view { padding: 32px clamp(20px, 3.2vw, 56px) 56px; scrollbar-gutter: stable; }
.enthy-learning .wrap { max-width: 960px; }
.enthy-learning .learner-hero { padding: 10px 0 28px; }.enthy-learning .learner-hero h1 { font-size: clamp(28px, 3.2vw, 40px); letter-spacing: -.05em; }
.enthy-learning .learner-hero p { font-size: 1rem; }
.enthy-learning .eyebrow { font: 600 12px/1.5 var(--sans); letter-spacing: .1em; }
.enthy-learning :is(.hero-mark,.account-orbit) { width: 64px; height: 64px; border: 1px solid var(--edge); border-radius: 22px; color: var(--accent); background: linear-gradient(145deg, #ffffffc0, #c1dedc80); box-shadow: var(--depth); }
.enthy-learning :is(.karte,.kurskarte,.quota-card,.kachel) { padding: 24px; border-radius: 22px; border: 1px solid var(--edge); background: var(--reading); box-shadow: var(--depth); }
.enthy-learning .start-card { padding: 28px; border: 1px solid var(--edge); border-radius: 26px; background: linear-gradient(120deg, #ebf5f2eb, var(--reading)); box-shadow: var(--depth); }
.enthy-learning .start-card h2 { font-size: 23px; font-weight: 600; }.enthy-learning .start-card .sub { font-size: 14px; }
.enthy-learning .trust-strip { padding: 18px 4px; font-size: 13px; }
.enthy-learning .btn { min-height: 44px; border-radius: 14px; padding: 9px 16px; font-size: 14px; background: var(--glass); }
.enthy-learning .btn.pri { background: linear-gradient(145deg, #367c81, #17545b); border: 1px solid #ffffff30; color: #fff; box-shadow: inset 0 1px #ffffff45, 0 5px 14px #173f4620; }
.enthy-learning .btn.gross { min-height: 50px; padding: 12px 24px; font-size: 16px; }
.enthy-learning .btn.sm { min-height: 36px; padding: 5px 11px; font-size: 13px; }
.enthy-learning .chip { min-height: 38px; padding: 7px 13px; font-size: 13px; }
.enthy-learning .today { margin: 12px; padding: 15px; border-radius: 18px; background: #e1eeeaad; border: 1px solid var(--edge); }
.enthy-learning .today .t { font-size: 15px; }.enthy-learning .today .why { font-size: 12px; }
.enthy-learning .list { padding: 2px 12px 20px; }.enthy-learning .sec { padding-top: 20px; font-size: 11px; }
.enthy-learning .row { min-height: 42px; border-radius: 12px; font-size: 14px; }
.enthy-learning .row.fam, .enthy-learning .row.sub { font-size: 13px; }
.enthy-learning .foot { padding: 14px; font-size: 12px; }
.enthy-learning .account-trigger { min-height: 42px; padding: 5px 11px 5px 5px; font-size: 13px; box-shadow: inset 0 1px #ffffffc0; }
.enthy-learning .account-avatar { width: 30px; height: 30px; font-size: 12px; }
.enthy-learning .account-email { max-width: 150px; }
.enthy-learning .stem { font-size: 18px; line-height: 1.7; margin: 15px 0 24px; }
.enthy-learning .opt { min-height: 56px; align-items: flex-start; padding: 15px 17px; margin-bottom: 10px; border-radius: 16px; border-color: var(--rule-2); background: var(--plane); }
.enthy-learning .opt .k { width: 28px; height: 28px; }.enthy-learning .opt .t { line-height: 1.65; }
.enthy-learning .opt.sel { border-color: var(--accent); background: color-mix(in srgb, var(--accent) 7%, var(--plane)); }
.enthy-learning .opt.ok { border-color: var(--good); background: color-mix(in srgb, var(--good) 9%, var(--plane)); }
.enthy-learning .opt.nok { border-color: var(--bad); background: color-mix(in srgb, var(--bad) 8%, var(--plane)); }
.enthy-learning .erkl { padding: 20px; border-radius: 18px; font-size: 16px; line-height: 1.75; }
.enthy-learning .ls { font-size: 16px; line-height: 1.8; }.enthy-learning h3.sh { font-size: 12px; margin-top: 28px; }
.enthy-learning .kmeta, .enthy-learning .stat { font-size: 13px; }
.enthy-learning .kachel .lbl, .enthy-learning .kachel .sub { font-size: 13px; }
.enthy-learning :is(input[type=email],input[type=text],textarea,select) { min-height: 46px; border-radius: 13px; font-size: 16px; }
.enthy-learning #rightpanel { margin: 16px 16px 16px 0; border-radius: 26px; border-color: var(--edge); background: var(--reading); box-shadow: var(--depth); }
.enthy-learning #panelhost { display: contents; }
.enthy-learning #rightpanel { grid-column: 3; grid-row: 1; }
.enthy-learning #rightpanel .hd { min-height: 62px; padding: 10px 16px; }
.enthy-learning .tutor .verlauf, .enthy-learning .tutor .antwort .ls { font-size: 16px; }
.enthy-learning .tutor .frage { padding: 14px; border-radius: 18px 18px 4px 18px; }
.enthy-learning .tutor .eingabe { padding: 14px; }.enthy-learning .tutor-head { padding: 20px 16px 14px; }
.enthy-learning .quota-card p { font-size: 15px; }.enthy-learning .quota-note { font-size: 13px; }
.enthy-learning .kursliste { gap: 18px; }.enthy-learning .kurskarte .t { font-size: 20px; }.enthy-learning .kurskarte .m { font-size: 14px; }
.enthy-learning a.kurskarte { text-decoration: none; color: var(--ink); }
/* The builder frames nothing: bauer.css paints an open sky behind floating glass. */
.enthy-builder #haupt { background: transparent; }
.enthy-builder #shell { height: 100dvh; }
.enthy-builder .kopf .marke { font-size: 22px; letter-spacing: -.05em; }
.enthy-builder .kopf .marke span { letter-spacing: 0; font-size: 12px; }
.enthy-builder #inhalt { padding: 40px clamp(22px,4vw,60px) 70px; }
.enthy-builder .phasenkopf { font-size: clamp(26px,3vw,36px); letter-spacing: -.045em; line-height: 1.2; }
.enthy-builder .phasensatz { font-size: 16px; line-height: 1.8; margin: 16px 0 28px; }
.enthy-builder .beispiel { border-radius: 20px; padding: 22px; background: var(--glass); box-shadow: var(--depth); }
.enthy-builder .beispiel b { font-size: 15px; }.enthy-builder .beispiel span { font-size: 14px; line-height: 1.7; }
.enthy-builder :is(.btn,.tbtn) { min-height: 44px; border-radius: 13px; }
@media(max-width:720px) { .enthy-builder #inhalt { padding: 26px 18px 50px; }.enthy-builder .kopf .mail { max-width: 130px; }.enthy-builder .kopf .marke span { display: block; margin: 4px 0 0; } }

/* Light follows the hand on discovery cards; lessons remain stable. */
:is(.art-window,.course-card-visual,.creator-art-window,.outcome-card,.price-card,.kurskarte,[data-glass-card]) {
  position: relative; isolation: isolate;
  transform: perspective(1100px) rotateX(var(--tilt-x, 0deg)) rotateY(var(--tilt-y, 0deg));
  transition: transform 420ms cubic-bezier(.2,.75,.25,1), box-shadow 300ms ease, border-color 250ms ease;
}
/* These two preview windows already use absolute positioning in their layouts. */
.art-window, .course-card-visual, .creator-art-window { position: absolute; }
:is(.art-window,.course-card-visual,.creator-art-window,.outcome-card,.price-card,.kurskarte,[data-glass-card])::after {
  content: ''; position: absolute; inset: 0; z-index: 2; border-radius: inherit;
  pointer-events: none; opacity: 0;
  background: radial-gradient(450px circle at var(--light-x, 25%) var(--light-y, 15%), #ffffff45, #c3eeec0a 55%, transparent 75%);
  box-shadow: inset 0 1px 0 #ffffffb3;
  transition: opacity 350ms ease;
}
.glass-tracking { transition-duration: 100ms !important; will-change: transform; }
.glass-tracking::after { opacity: 1; }
.site-header { transition: background 250ms ease, box-shadow 250ms ease; }
.site-header.is-condensed { background: #f5fbfbe8; box-shadow: 0 10px 35px #244c591c, inset 0 1px #fff; }
.site-nav a { position: relative; transition: color 180ms ease; }
.site-nav a::after { content: ''; position: absolute; bottom: -6px; left: 0; right: 0; height: 2px; border-radius: 3px; background: var(--accent); transform: scaleX(0); transform-origin: left; transition: transform 220ms ease; }
.site-nav a.is-active::after, .site-nav a:focus-visible::after { transform: scaleX(1); }
@keyframes glass-arrive { from { opacity: .4; translate: 0 14px; } to { opacity: 1; translate: 0 0; } }
.glass-arrive { animation: glass-arrive 650ms cubic-bezier(.2,.75,.25,1) both; }
@media (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference) {
  :is(.outcome-card,.price-card,.kurskarte,[data-glass-card]):hover { box-shadow: 0 24px 55px #224c591c, inset 0 1px #fff; border-color: var(--glass-edge-strong); }
  .site-nav a:hover::after { transform: scaleX(1); }
  :is(.button,.course-button,.btn) { transition: transform 200ms ease, box-shadow 220ms ease, background 200ms ease; }
  :is(.button,.course-button,.btn):hover:not(:disabled) { transform: translateY(-2px); box-shadow: 0 10px 24px #1d495b23; }
  :is(.button,.course-button,.btn):active:not(:disabled) { transform: translateY(0) scale(.985); }
  .workflow-list li { transition: border-color 200ms ease, background 200ms ease; }
  .workflow-list li:hover { border-color: var(--glass-edge-strong); background: #ffffffd9; }
}
@media (prefers-reduced-motion:reduce), (hover:none), (pointer:coarse) {
  :is(.art-window,.course-card-visual,.creator-art-window,.outcome-card,.price-card,.kurskarte,[data-glass-card]) { transform: none !important; }
  .glass-tracking::after { opacity: 0; }
}

html.wheel-damping { scroll-behavior: auto !important; }
.scroll-preference { color: inherit; font: inherit; background: transparent; border: 1px solid currentColor; border-radius: 30px; padding: 7px 12px; cursor: pointer; }
.scroll-preference:focus-visible { outline: 2px solid currentColor; outline-offset: 4px; }
.scroll-preference:disabled { cursor: default; opacity: .8; }

/* Deep focus uses the same hierarchy with sufficient contrast. */
html[data-theme="dark"] {
  --plane: #162b32; --ink: #e7f3f4; --ink-2: #bfd0d5; --ink-3: #afc3c8; --ink-4: #8da9b0;
  --accent: #93d5d5; --accent-dim: #27474e; --muted: var(--ink-2); --glass: #233d46d9;
  --glass-active: #375761; --reading: #182f37f5; --frost: #1b343dde; --edge: #93c7d52c;
  --glass-edge: var(--edge); --glass-edge-strong: #8eb2bc60; --rule: #b4d3dd1a; --rule-2: #b4d3dd38;
  --rail-hover: #7ba9b01a; --rail-active: #42636d70; --surface-2: #7ba9b012;
  --depth: 0 12px 30px #06131926, inset 0 1px #d3f5ff0d;
  --float-depth: 0 20px 55px #06131938, inset 0 1px #d3f5ff12;
}
html[data-theme="dark"] body.enthy-learning, html[data-theme="dark"] body.enthy-builder { background: radial-gradient(ellipse at top left, #234b56, transparent 65%), #10232c; }
html[data-theme="dark"] .enthy-learning > main { background: #12293299; }
html[data-theme="dark"] .enthy-learning .start-card { background: linear-gradient(120deg, #24454b, var(--reading)); }
html[data-theme="dark"] .enthy-learning .today { background: #26454c; }
html[data-theme="dark"] .enthy-learning :is(.hero-mark,.account-orbit) { background: linear-gradient(140deg, #355964, #223c47); }
html[data-theme="dark"] .enthy-learning .account-avatar, html[data-theme="dark"] .enthy-learning .opt.sel .k { color: #123238; }
html[data-theme="dark"] .enthy-learning :is(.tag.a,.chip.on,.tutor-spark) { color: #123238; }
html[data-theme="dark"] .enthy-learning :is(.opt.ok .k,.opt.nok .k,.khak.ja,.khak.nein) { color: #102c2b; }

@media (hover:hover) {
  .enthy-learning .opt:hover { border-color: var(--accent); }
  .enthy-learning .kurskarte:hover, .enthy-learning .kachel:hover { box-shadow: var(--float-depth); border-color: var(--glass-edge-strong); }
}
@media (max-width:1100px) {
  .enthy-learning header { gap: 10px; }.enthy-learning .modes { order: 4; width: 100%; overflow-x: auto; flex-wrap: nowrap; scrollbar-width: none; }
  .enthy-learning .modes::-webkit-scrollbar { display: none; }
  .enthy-learning .modes button { white-space: nowrap; flex: 1 0 auto; }
  body.enthy-learning.right-open { --navw: 0px; --rightw: 46vw; }
}
@media (max-width:820px) {
  body.enthy-learning { --navw: 0px; }
  .enthy-learning > aside { position: fixed; inset: 90px auto 14px 12px; width: min(282px, calc(100vw - 32px)); margin: 0; z-index: 50; background: var(--reading); box-shadow: var(--float-depth); }
  .enthy-learning > main { margin: 10px; border-radius: 24px; }
}
@media (max-width:720px) {
  .course-hero { grid-template-columns: minmax(0, 1fr); }
  .course-disc { inset: 7% 3%; }
  .site-header, .course-header, .enthy-info > header { top: 8px; width: calc(100% - 24px); min-height: 60px; margin-top: 8px; padding: 10px 15px; }
  .site-nav { top: 66px; border-radius: 22px; padding: 10px; background: #f8fcfcf5; border-color: var(--edge); }
  .site-nav a { min-height: 46px; }.menu-toggle { width: 44px; height: 40px; }
  .hero { padding: 62px 0 66px; gap: 36px; }.hero h1 { font-size: clamp(2.8rem, 12.5vw, 4.7rem); line-height: 1.04; }
  .hero-lead { font-size: 1rem; }.hero-art { min-height: 390px; }
  .art-content { padding: 24px 20px; }.art-title { font-size: 1.5rem; }
  .art-float { padding: 10px 12px; min-width: 0; }.art-float-a { left: 0; }.art-float-b { right: 0; bottom: -10px; }
  .visual-float-a { left: 0; }.visual-float-b { right: 0; }
  .art-backdrop { inset: 7% 0 3%; border-radius: 30px; transform: rotate(-2deg); }
  .signal-row { padding: 18px; }.signal-row span { padding: 0; }
  .intro-grid h2, .demo-intro h2, .workflow-heading h2, .trust-copy h2, .pricing-heading h2, .interest-copy h2, .faq-heading h2 { font-size: clamp(2rem, 8vw, 2.7rem); }
  .workflow-list li, .workflow-list li + li { padding: 24px 62px 24px 24px; }
  .site-footer { margin: 8px; border-radius: 26px; }.course-header-label { display: none; }
  .enthy-info article { padding: 24px; }.enthy-info main { padding: 0 12px; }
  .enthy-learning header { padding: 12px; }.enthy-learning header h2 { min-width: 0; }
  .enthy-learning #view { padding: 22px 14px 40px; }.enthy-learning .wrap { padding: 0; }
  .enthy-learning :is(.karte,.quota-card,.kurskarte,.kachel) { padding: 19px; border-radius: 20px; }
  .enthy-learning .start-card { padding: 22px; }.enthy-learning .learner-hero { gap: 14px; }
  .enthy-learning .account-email { display: none; }.enthy-learning .account-trigger { padding: 5px; }
  .enthy-learning .hero-mark { width: 46px; height: 46px; border-radius: 16px; }
  .enthy-learning #rightpanel { position: fixed; inset: 0; margin: 0; border-radius: 0; }
}
@supports not (backdrop-filter: blur(2px)) {
  :root { --frost: #f5fafb; }.enthy-learning > main { background: #edf5f6; }
  html[data-theme="dark"] { --frost: #203943; }
}
@media (prefers-reduced-transparency:reduce) {
  :root { --frost: #f5fafb; --glass: #f5fafb; --reading: #fbfdfd; }
  html[data-theme="dark"] { --frost: #203943; --glass: #203943; --reading: #182f37; }
}
@media (prefers-reduced-motion:reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation: none !important; transition: none !important; }
  .button:hover { transform: none; }
}