/* Reference tokens adapted to CURSAZO; all type uses the real files in assets. */
:root{
  --color-notion-blue:#0075de;--color-paper-warmth:#f6f5f4;--color-pure-white:#fff;
  --color-ink-black:#000;--color-charcoal:#111;--color-stone:#757575;--color-graphite:#615d59;
  --color-slate:#696969;--color-sky-tint:#e6f3fe;--color-marigold:#ffb110;--color-coral:#f64932;
  --color-saffron:#e89d01;--color-vermillion:#e32d14;--color-mocha:#b18164;
  --color-signal-blue:#097fe8;--color-sky-wash:#62aef0;--color-midnight-ink:#02093a;
  --font-display:Manrope,Arial,sans-serif;--font-body:'Inter Tight',Arial,sans-serif;
  --text-caption:12px;--text-body-sm:14px;--text-body:16px;--text-subheading:20px;
  --text-heading-sm:22px;--text-heading:40px;--text-heading-lg:48px;--text-display-sm:54px;
  --text-display:72px;--text-display-lg:96px;--spacing-unit:4px;
  --spacing-4:4px;--spacing-8:8px;--spacing-12:12px;--spacing-16:16px;--spacing-20:20px;
  --spacing-24:24px;--spacing-28:28px;--spacing-32:32px;--spacing-36:36px;--spacing-64:64px;--spacing-80:80px;
  --radius-cards:12px;--radius-pills:9999px;--radius-small:4px;--radius-buttons:8px;
  --surface-page-canvas:#f6f5f4;--surface-card-surface:#fff;
  --surface-accent-card-surface:#ffb110;--surface-dark-card-surface:#02093a;
  --motion-ease:cubic-bezier(.22,1,.36,1);
}
.editorial-hero{padding-top:40px}
.hero-marks{display:flex;align-items:center;justify-content:center;gap:8px;margin-bottom:18px;height:44px}
.hero-mark{display:block;width:40px;height:40px;flex-shrink:0;transform-origin:50% 78%}
.hero-mark svg{display:block;width:100%;height:100%}
.mark-sun{transform:rotate(-8deg)}.mark-play{transform:rotate(5deg)}
.mark-flower{width:46px;height:46px}.mark-note{transform:rotate(-6deg)}.mark-star{transform:rotate(9deg)}
.hero-intro h1.motion-title{max-width:1020px;font-size:72px;line-height:1.18;letter-spacing:-.043em;margin-top:16px}
.title-mask{display:block;overflow:hidden;padding:.09em 0;margin:-.09em 0}
.hero-title-line{display:block}
.hero-title-row{display:inline-flex;align-items:baseline;justify-content:center;gap:.16em;white-space:nowrap;max-width:100%}
.hero-prefix{display:block;flex:0 0 auto}
.hero-suffix{display:inline-block;white-space:nowrap}
.topic-slot{display:inline-flex;flex:0 0 auto;justify-content:center;vertical-align:baseline;position:relative;overflow:hidden;border-radius:9999px;padding:.025em .26em .1em;margin-bottom:-.1em;line-height:1.12;letter-spacing:-.045em;background:var(--color-marigold);color:#111;transition:background-color 200ms ease,color 200ms ease;transform-origin:50% 75%;isolation:isolate}
.topic-active{display:block;white-space:nowrap;text-align:center;flex:0 0 auto}
.topic-width-probe{position:absolute;top:0;left:0;display:block;visibility:hidden;pointer-events:none;user-select:none;white-space:nowrap;font:inherit;letter-spacing:inherit;line-height:inherit}
.topic-slot[data-tone=yellow]{background:var(--color-marigold)}
.topic-slot[data-tone=sky]{background:var(--color-sky-wash)}
.topic-slot[data-tone=peach]{background:#f6d5b8}
.topic-slot[data-tone=coral]{background:var(--color-coral)}
.topic-slot[data-tone=midnight]{background:var(--color-midnight-ink);color:#fff}
.topic-slot[data-tone=tint]{background:var(--color-sky-tint)}
.hero-intro>p{margin-top:20px}.hero-note{display:inline-flex;margin-top:18px}
.motion-controls{display:none;margin-top:18px;margin-left:16px;vertical-align:middle}
html[data-motion] .motion-controls{display:inline-flex}
#motion-toggle{display:inline-flex;align-items:center;gap:5px;background:transparent;border:0;border-radius:4px;padding:3px 0;font-size:11px;line-height:18px;color:var(--secondary)}
#motion-toggle svg{width:14px;height:14px}#motion-toggle .play-glyph{display:none}
#motion-toggle[aria-pressed=true] .pause-glyph{display:none}#motion-toggle[aria-pressed=true] .play-glyph{display:block}
#motion-toggle:disabled{cursor:default;opacity:.65}
.hero-selection{margin-top:38px}
.hero-course .course-thumb img{aspect-ratio:1.85}
.yellow-card{background:var(--color-marigold)}.ink-card{background:var(--color-midnight-ink);border-color:transparent}
.group-panel{background:var(--color-sky-tint)}
.editorial-number,.little-mark,.topic-icon svg{transform-origin:50% 65%}
.motion-ready .motion-reveal:not(.motion-visible){opacity:0;transform:translateY(18px)}
.motion-ready .motion-reveal.motion-visible{opacity:1;transform:none}
.learning-notebook{position:relative;overflow:hidden}
.notebook-steps .step-check{display:grid;place-items:center;width:17px;height:17px;flex-shrink:0;border:1px solid #0002;border-radius:4px;background:#f3f3f1}
.notebook-steps .step-check svg{width:14px;height:14px}
.notebook-steps li{transition:color 200ms ease}
.notebook-progress{height:4px;border-radius:9999px;overflow:hidden;background:#efeeec;margin-bottom:16px}
.notebook-progress>span{display:block;height:100%;background:var(--brand-orange);transform-origin:left center;transform:scaleX(1)}
.motion-ready .learning-notebook[data-demo-state=waiting] .step-check svg,
.motion-ready .learning-notebook[data-demo-state=playing] li:not(.step-complete) .step-check svg{opacity:0}
.motion-ready .learning-notebook[data-demo-state=waiting] .notebook-progress>span{transform:scaleX(0)}
.notebook-steps .step-complete .step-check{background:#ffb11033;border-color:#e89d0160}
.notebook-pointer{display:none;position:absolute;top:0;left:0;width:28px;height:28px;pointer-events:none}
.notebook-pointer svg{width:28px;height:28px}
.motion-ready .learning-notebook[data-demo-state=playing] .notebook-pointer{display:block}
html[data-motion=paused] .motion-reveal{opacity:1!important;transform:none!important}
html[data-motion=paused] main *,html[data-motion=paused] .editorial-footer *{animation:none!important;transition:none!important}
@media(hover:hover){
  #motion-toggle:not(:disabled):hover{color:#111}
  .motion-ready[data-motion=running] .hero-mark:hover{animation:mark-nod 520ms cubic-bezier(.3,1.4,.4,1)}
  .motion-ready[data-motion=running] .topic-card:hover .topic-icon svg{animation:mark-nod 520ms cubic-bezier(.3,1.4,.4,1)}
}
@keyframes mark-nod{0%,100%{transform:rotate(0) scale(1)}35%{transform:rotate(-13deg) scale(1.15)}65%{transform:rotate(8deg) scale(.98)}}
@media(max-width:1150px){.hero-intro h1.motion-title{font-size:64px}.hero-course .course-thumb img{aspect-ratio:1.4}}
@media(max-width:700px){
 .editorial-hero{padding-top:30px}.hero-marks{gap:5px;height:36px;margin-bottom:16px}
 .hero-mark{width:32px;height:32px}.mark-flower{width:38px;height:38px}
 .hero-intro h1.motion-title{font-size:40px;line-height:1.24;max-width:100%;margin-top:16px;letter-spacing:-.045em}
 .topic-slot{padding:.025em .2em .1em}.hero-note{font-size:10px;gap:15px;margin-top:17px}
 .motion-controls{margin-left:0;margin-top:10px;display:none;width:100%;justify-content:center}
 #motion-toggle{font-size:10px}.hero-selection{margin-top:30px}
 .hero-intro>p{font-size:15px;margin-top:16px}.hero-actions{margin-top:22px}
}
@media(max-width:380px){.hero-intro h1.motion-title{font-size:34px}.hero-intro>p{font-size:14px}.hero-note{font-size:9px;gap:13px}}
@media(prefers-reduced-motion:reduce){
 .motion-reveal{opacity:1!important;transform:none!important}
 .topic-active,.hero-title-line,.hero-mark{opacity:1!important;transform:none!important}
 .notebook-pointer{display:none!important}
}