body.single-post,.sp,.sp-progress,.sp-top{--dark:#121C13;--green:#AEDF60;--cream:#FEFBEC;--donate:var(--donate);--donate-bg:#FBE3DA;--muted:#6B7466;--line:#E6E2CC;
  --verbs:#F5EC8C;--grammar:#DCD4F8;--vocab:#D3E3FB;--fund:#DCF0B4;
  --cat:var(--verbs);font-family:Inter,sans-serif;color:var(--dark)}
.sp *{box-sizing:border-box}
.sp a,.sp a:hover,.sp a:focus{color:inherit}
.sp .sp-promo{color:var(--cream)}
.sp-progress{position:fixed;top:0;left:0;right:0;height:5px;z-index:2000;background:transparent;pointer-events:none}
.sp-progress span{display:block;height:100%;width:0;background:var(--green);border-radius:0 3px 3px 0;box-shadow:0 0 0 1px rgba(18,28,19,.08)}

.sp-wrap{max-width:1240px;margin:0 auto;padding:48px 24px 96px}
.sp-grid{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:56px;align-items:start}

/* Top */
.sp-crumb{font:500 13px "Space Grotesk",sans-serif;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin:0 0 18px}
.sp-crumb a{text-decoration:none}.sp-crumb a:hover{color:var(--dark)}
.sp-title{font:700 clamp(36px,5vw,60px)/1.02 "Space Grotesk",sans-serif;letter-spacing:-.025em;margin:0 0 18px}
.sp-meta{display:flex;flex-wrap:wrap;gap:8px 18px;font-size:14px;color:var(--muted);margin:0 0 28px}

/* Video */
.sp-video{position:relative;aspect-ratio:16/9;border-radius:24px;overflow:hidden;background:var(--dark);cursor:pointer;
  display:flex;align-items:flex-end;padding:28px}
.sp-video::before{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,.35),rgba(0,0,0,0) 45%);z-index:1;pointer-events:none}
.sp-video .sp-v-label{position:relative;font:400 clamp(28px,4vw,52px)/.95 Anton,sans-serif;text-transform:uppercase;color:var(--green);max-width:70%}
.sp-play{position:absolute;left:50%;top:50%;width:84px;height:84px;margin:-42px 0 0 -42px;border-radius:50%;background:var(--green);
  display:flex;align-items:center;justify-content:center;transition:transform .2s}
.sp-video:hover .sp-play{transform:scale(1.08)}
.sp-play svg{width:30px;height:30px;margin-left:5px}
.sp-v-yt{position:absolute;top:22px;right:22px;font:500 13px "Space Grotesk",sans-serif;color:var(--cream);opacity:.7}


/* General post: byline + cover */
.sp-byline{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;font-size:14.5px;color:var(--muted);margin:0 0 28px}
.sp-byline img{width:40px;height:40px;border-radius:50%;object-fit:cover;box-shadow:0 0 0 2px #fff,0 0 0 3.5px var(--green)}
.sp-byline b{color:var(--dark)}
.sp-cover{position:relative;aspect-ratio:16/8;border-radius:24px;background:var(--cat);overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end;padding:30px 34px}
.sp-cover-lbl{font:500 13px "Space Grotesk",sans-serif;letter-spacing:.08em;text-transform:uppercase;color:rgba(18,28,19,.6);margin-bottom:6px}
.sp-cover-big{font:400 clamp(56px,9vw,120px)/.85 Anton,sans-serif;text-transform:uppercase;color:var(--dark)}
.sp-cover-b{position:absolute;font:700 clamp(14px,1.6vw,19px) "Space Grotesk",sans-serif;padding:10px 15px;border-radius:16px;white-space:nowrap}
.sp-cover-b1{right:6%;top:10%;background:var(--dark);color:var(--cream);border-bottom-right-radius:4px;transform:rotate(3deg)}
.sp-cover-b2{right:30%;top:22%;background:#fff;color:var(--dark);border-bottom-left-radius:4px;transform:rotate(-3deg);box-shadow:3px 3px 0 var(--dark)}
.sp-cover-b3{right:7%;top:36%;background:#fff;color:var(--dark);border-bottom-right-radius:4px;transform:rotate(-2deg);box-shadow:3px 3px 0 var(--dark)}
.sp-cover-b4{right:27%;top:49%;background:var(--dark);color:var(--green);border-bottom-left-radius:4px;transform:rotate(2deg)}
@media (max-width:600px){.sp-cover{aspect-ratio:4/3;padding:22px}.sp-cover-b{font-size:13px;padding:7px 11px}.sp-cover-b2{right:auto;left:8%;top:10%}.sp-cover-b4{display:none}}

/* Category pills */
.sp-pills{display:flex;flex-wrap:wrap;gap:8px;margin:22px 0 32px}
.sp-pill{display:inline-flex;align-items:center;gap:8px;padding:9px 18px;border-radius:999px;border:1.5px solid rgba(18,28,19,.14);
  font:500 15px "Space Grotesk",sans-serif;text-decoration:none;transition:background .15s,border-color .15s}
.sp-pill i{width:10px;height:10px;border-radius:50%;display:inline-block}
.sp-pill:hover{border-color:var(--dark)}
.sp-pill.is-active{border-color:transparent}
.sp-c-verbs i,.sp-pill.sp-c-verbs.is-active{background:var(--verbs)}
.sp-c-grammar i,.sp-pill.sp-c-grammar.is-active{background:var(--grammar)}
.sp-c-vocab i,.sp-pill.sp-c-vocab.is-active{background:var(--vocab)}
.sp-c-fund i,.sp-pill.sp-c-fund.is-active{background:var(--fund)}
.sp-pill.is-active i{background:var(--dark)}

/* Summary */
.sp-summary{background:var(--cat);border-radius:24px;padding:36px 40px}
.sp-label{font:500 13px "Space Grotesk",sans-serif;letter-spacing:.08em;text-transform:uppercase;color:rgba(18,28,19,.6);margin:0 0 14px}
.sp-summary p.sp-lead{font:500 21px/1.45 "Space Grotesk",sans-serif;margin:0 0 22px}
.sp-checks{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.sp-checks li{position:relative;padding-left:34px;font-size:16px;line-height:1.5}
.sp-checks li::before{content:"";position:absolute;left:0;top:1px;width:22px;height:22px;border-radius:6px;background:var(--dark) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%23AEDF60' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 10.5l3.2 3L15 7'/%3E%3C/svg%3E") center/16px no-repeat}

.sp .sp-label{font:500 13px/1.4 "Space Grotesk",sans-serif;letter-spacing:.08em;text-transform:uppercase;color:rgba(18,28,19,.6)}
/* Ads */
.sp-ad{margin:36px 0;background:#E9E8E2;border-radius:18px;padding:10px 12px 12px;text-align:center}
.sp-ad small{display:flex;align-items:center;justify-content:center;gap:10px;font:500 11px Inter,sans-serif;letter-spacing:.12em;text-transform:uppercase;color:#8C8F86;margin-bottom:8px}
.sp-ad small::before,.sp-ad small::after{content:"";flex:1;height:1px;background:#D6D5CD}
.sp-ad div{border-radius:10px;background:#F7F7F3;display:flex;align-items:center;justify-content:center;color:#A6A89F;font:500 14px "Space Grotesk",sans-serif;height:100px}
.sp-ad.sp-ad-box div{height:250px}
/* Lesson body */
.sp-body{margin-top:28px;background:#fff;border-radius:28px;padding:48px 52px;border:1px solid var(--line)}
.sp-body > .sp-label{margin-bottom:6px}
.sp-body h2{font:700 30px/1.15 "Space Grotesk",sans-serif;letter-spacing:-.015em;margin:44px 0 14px;scroll-margin-top:120px}
.sp-body h2:first-of-type{margin-top:8px}
.sp-body h3{font:700 20px/1.3 "Space Grotesk",sans-serif;margin:28px 0 10px}
.sp-body p,.sp-body li{font-size:17.5px;line-height:1.7;color:#2A3328}
.sp-body p{margin:0 0 18px}
.sp-body ul.sp-list{padding-left:0;list-style:none;margin:0 0 20px}
.sp-body ul.sp-list li{position:relative;padding-left:26px;margin-bottom:8px}
.sp-body ul.sp-list li::before{content:"";position:absolute;left:4px;top:.65em;width:9px;height:9px;border-radius:3px;background:var(--cat);box-shadow:0 0 0 1.5px var(--dark)}
.sp-ex{display:grid;gap:8px;margin:6px 0 24px}
.sp-ex > div:not(.wp-block-group__inner-container){display:flex;flex-wrap:wrap;gap:4px 14px;align-items:baseline;background:#FAF8EE;border-radius:12px;padding:12px 16px}
.sp-ex b{font:700 18px "Space Grotesk",sans-serif}
.sp-ex span{color:var(--muted);font-size:15.5px}
.sp-body mark{background:var(--cat);color:inherit;padding:0 4px;border-radius:4px}

/* Tip / quote card */
.sp-tip{position:relative;background:var(--dark);color:var(--cream);border-radius:22px;padding:30px 36px 32px;margin:34px 0}
.sp-tip-head{display:flex;align-items:center;gap:12px;margin:0 0 14px}
.sp-tip-ico{flex:none;width:38px;height:38px;border-radius:11px;background:var(--green);color:var(--dark);display:inline-flex;align-items:center;justify-content:center;transform:rotate(-4deg)}
.sp-tip-ico svg{width:20px;height:20px}
.sp-tip p{color:var(--cream)!important;font:500 21px/1.45 "Space Grotesk",sans-serif!important;margin:0!important}
.sp-tip small{font:500 13px "Space Grotesk",sans-serif;letter-spacing:.08em;text-transform:uppercase;color:#8F9A88}

/* Table */
.sp-table{width:100%;border-collapse:separate;border-spacing:0;margin:10px 0 26px;border:1px solid var(--line);border-radius:16px;overflow:hidden;font-size:16px}
.sp-table th{background:var(--cat);font:700 14px "Space Grotesk",sans-serif;text-transform:uppercase;letter-spacing:.06em;text-align:left;padding:14px 18px}
.sp-table td{padding:13px 18px;border-top:1px solid var(--line)}
.sp-table tr:nth-child(even) td{background:#FBFAF3}

/* Practice */
.sp-quiz{display:grid;gap:10px;margin:8px 0 10px}
.sp-quiz details{border:1.5px solid var(--line);border-radius:14px;padding:14px 18px;background:#FDFCF6}
.sp-quiz summary{cursor:pointer;font:500 17px "Space Grotesk",sans-serif;list-style:none;display:flex;justify-content:space-between;gap:12px}
.sp-quiz summary::-webkit-details-marker{display:none}
.sp-quiz summary::after{content:"Show answer";flex:none;font:500 13px Inter,sans-serif;color:var(--muted);align-self:center}
.sp-quiz details[open] summary::after{content:"Hide"}
.sp-quiz details p{margin:10px 0 0!important;font-size:16px!important}

/* Reference sheet signup */
html{scroll-behavior:smooth}
.sp-toprow{align-items:center}
.sp-jump{margin-left:auto;display:inline-flex;align-items:center;gap:10px;text-decoration:none;font:700 15px "Space Grotesk",sans-serif;
  padding:6px 16px 6px 6px;border-radius:999px;background:var(--dark);color:var(--cream)!important;transition:transform .15s}
.sp-jump:hover{transform:translateY(-1px)}
.sp-jump b{color:var(--green);display:inline-block;transition:transform .2s}
.sp-jump:hover b{transform:translateY(3px)}
.sp-jump-ico{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:50%;background:var(--cat);color:var(--dark);font:700 10px "Space Grotesk",sans-serif}
.sp-sheet{display:grid;grid-template-columns:200px 1fr;gap:36px;align-items:center;background:var(--cat);border-radius:24px;padding:36px 40px;margin:44px 0 0;scroll-margin-top:120px}
.sp-sheet-art{display:flex;justify-content:center}
.sp-paper{position:relative;width:150px;aspect-ratio:1/1.3;background:#fff;border-radius:12px;box-shadow:0 0 0 1.5px var(--dark),8px 8px 0 var(--dark);transform:rotate(-5deg);padding:18px 16px;display:flex;flex-direction:column;gap:8px}
.sp-paper b{font:700 14px "Space Grotesk",sans-serif;margin-bottom:4px}
.sp-paper i{display:block;height:6px;border-radius:3px;background:#E3E0CF}
.sp-paper i.s{width:60%}
.sp-paper span{position:absolute;right:-12px;bottom:16px;background:var(--dark);color:var(--green);font:700 12px "Space Grotesk",sans-serif;padding:5px 10px;border-radius:8px;transform:rotate(5deg)}
.sp-sheet h3{font:700 28px/1.15 "Space Grotesk",sans-serif;letter-spacing:-.01em;margin:0 0 10px}
.sp-sheet .sp-label{margin-bottom:8px}
.sp-sheet-txt{margin:0 0 20px!important;font-size:16.5px!important;color:#30392d!important}
.sp-form{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.sp-form input{min-width:0;background:#fff;border:1.5px solid var(--dark);border-radius:12px;padding:15px 16px;font:15px Inter,sans-serif;color:var(--dark)}
.sp-form input:focus{outline:0;box-shadow:0 0 0 3px rgba(18,28,19,.15)}
.sp-consent{grid-column:1/-1;display:flex;gap:10px;align-items:flex-start;font-size:13.5px;line-height:1.45;color:#30392d;cursor:pointer;margin:4px 0 2px}
.sp-form .sp-consent input{padding:0;appearance:none;-webkit-appearance:none;flex:none;width:20px;height:20px;margin:1px 0 0;border:1.5px solid var(--dark);border-radius:6px;background:#fff;cursor:pointer;display:grid;place-content:center}
.sp-form .sp-consent input:checked{background:var(--dark) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%23AEDF60' stroke-width='2.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 10.5l3.2 3L15 7'/%3E%3C/svg%3E") center/15px no-repeat}
.sp-consent a{text-decoration:underline;text-underline-offset:2px}
.sp-form button{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:12px;border:0;cursor:pointer;background:var(--dark);color:var(--cream);
  border-radius:12px;padding:6px 6px 6px 20px;font:700 15px "Space Grotesk",sans-serif;text-transform:uppercase;letter-spacing:.02em;transition:transform .15s}
.sp-form button:hover{transform:translateY(-1px)}
.sp-form button span{width:40px;height:40px;border-radius:9px;background:var(--green);color:var(--dark);display:inline-flex;align-items:center;justify-content:center}
.sp-form button svg{width:18px;height:18px}
.sp-form button:hover svg{animation:sp-bounce .6s ease-in-out}
@keyframes sp-bounce{0%,100%{transform:translateY(0)}40%{transform:translateY(4px)}70%{transform:translateY(-2px)}}
.sp-sheet-note{margin:10px 0 0!important;font-size:13px!important;color:#4b5446!important}

/* Prev / next */
.sp-nav{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:28px 0 0}
.sp-nav a{display:block;text-decoration:none;border:1.5px solid var(--line);border-radius:20px;padding:20px 24px;background:#fff;transition:border-color .15s,transform .15s}
.sp-nav a:hover{border-color:var(--dark);transform:translateY(-2px)}
.sp-nav small{display:block;font:500 13px "Space Grotesk",sans-serif;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-bottom:6px}
.sp-nav b{font:700 19px/1.3 "Space Grotesk",sans-serif}
.sp-nav a:last-child{text-align:right}

/* Sidebar */
.sp-side{display:flex;flex-direction:column;gap:20px;align-self:stretch}
.sp-sticky{position:sticky;top:108px;display:grid;gap:16px}
/* top is set by post.js so a tall banner never gets cut off on short screens (iPad landscape) */
.sp-toc{border:1.5px solid var(--line);border-radius:20px;background:#fff;padding:22px 24px}
.sp-toc ol{list-style:none;margin:0;padding:0;counter-reset:t}
.sp-toc li{counter-increment:t;margin:0}
.sp-toc a{display:flex;gap:12px;padding:8px 0;text-decoration:none;font:500 15px/1.35 "Space Grotesk",sans-serif;color:#5a6356;transition:color .15s}
.sp-toc a::before{content:counter(t,decimal-leading-zero);font-size:12px;color:#A3A893;padding-top:2px}
.sp-toc a:hover,.sp-toc a.is-current{color:var(--dark)}
.sp-toc a.is-current::before{color:var(--dark)}
.sp-toc a.is-current{font-weight:700}

/* Promo block */
.sp-promo{position:relative;display:block;text-decoration:none;background:var(--dark);color:var(--cream);border-radius:22px;overflow:hidden}
.sp-promo-photo{position:relative;display:flex;flex-direction:column;gap:8px;padding:22px 16px 26px;background:var(--green);overflow:hidden;clip-path:polygon(0 0,100% 0,100% 88%,0 100%)}
.sp-promo-photo{background:var(--green) radial-gradient(circle at 85% 20%,color-mix(in srgb,var(--green),#fff 30%) 0,transparent 45%)}
.sp-bub{position:relative;max-width:84%;font:700 15px/1.3 "Space Grotesk",sans-serif;padding:8px 13px;border-radius:14px;transition:transform .35s cubic-bezier(.2,.7,.2,1)}
.sp-bub-1{align-self:flex-start;background:var(--dark);color:var(--cream);border-bottom-left-radius:4px;transform:rotate(-2deg)}
.sp-bub-2{align-self:flex-end;background:var(--cream);color:var(--dark);border-bottom-right-radius:4px;transform:rotate(1.5deg);box-shadow:3px 3px 0 var(--dark)}
.sp-bub-2 em{font-style:normal;color:#6B7466}
.sp-bub-2{font-weight:500!important}
.sp-bub-3{position:relative;z-index:2;float:right;margin:-20px 16px 0 0;background:var(--cream);color:var(--dark);border-bottom-right-radius:4px;padding:2px 14px 8px;font-size:20px;letter-spacing:2px;box-shadow:3px 3px 0 #000;transform:rotate(1.5deg)}
.sp-promo:hover .sp-bub-1{transform:rotate(-2deg) translateY(-3px)}
.sp-promo:hover .sp-bub-2{transform:rotate(1.5deg) translateY(-3px)}
.sp-promo:hover .sp-bub-3{transform:rotate(1.5deg) translateY(-3px)}
.sp-promo-tag{position:absolute;top:14px;left:18px;background:var(--dark);color:var(--green);font:700 11px "Space Grotesk",sans-serif;letter-spacing:.06em;text-transform:uppercase;padding:6px 10px;border-radius:999px}
.sp-promo-in{padding:8px 24px 22px}
.sp-promo small{font:500 12px "Space Grotesk",sans-serif;letter-spacing:.08em;text-transform:uppercase;color:#8F9A88}
.sp-promo h3{font:400 32px/.95 Anton,sans-serif;text-transform:uppercase;color:var(--green);margin:6px 0 14px}
.sp-promo ul{list-style:none;margin:0 0 18px;padding:0;display:grid;gap:7px}
.sp-promo li{display:flex;align-items:center;gap:10px;font:500 14.5px/1.3 "Space Grotesk",sans-serif}
.sp-promo li::before{content:"";flex:none;width:20px;height:20px;border-radius:6px;background:color-mix(in srgb,var(--green) 18%,var(--dark)) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%23AEDF60' stroke-width='2.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 10.5l3.2 3L15 7'/%3E%3C/svg%3E") center/14px no-repeat}
.sp-promo-btn{display:flex;align-items:center;justify-content:space-between;background:var(--green);color:var(--dark);border-radius:12px;padding:6px 6px 6px 18px;font:700 14px "Space Grotesk",sans-serif;text-transform:uppercase;letter-spacing:.02em;transition:transform .15s}
.sp-promo-btn span{width:34px;height:34px;border-radius:9px;background:var(--dark);color:var(--cream);display:inline-flex;align-items:center;justify-content:center}
.sp-promo-btn svg{width:17px;height:17px}
/* Same hover as the header "Paid courses" button */
.sp-promo-btn{position:relative;overflow:hidden;isolation:isolate;transition:transform .15s,color .3s}
.sp-promo-btn::before{content:"";position:absolute;inset:2px;z-index:-1;background:var(--dark);border-radius:10px;transform:scaleX(0);transform-origin:right;transition:transform .4s cubic-bezier(.7,0,.2,1)}
.sp-promo:has(.sp-promo-cover:hover) .sp-promo-btn{color:var(--green);transform:translateY(-1px)}
.sp-promo:has(.sp-promo-cover:hover) .sp-promo-btn::before{transform:scaleX(1)}
.sp-promo-btn span{transition:background .3s,color .3s;overflow:hidden}
.sp-promo:has(.sp-promo-cover:hover) .sp-promo-btn span{background:var(--green);color:var(--dark)}
.sp-promo:has(.sp-promo-cover:hover) .sp-promo-btn svg{animation:sp-arrow .45s ease-in-out}
@keyframes sp-arrow{0%{transform:translateX(0)}45%{transform:translateX(160%);opacity:0}55%{transform:translateX(-160%);opacity:0}100%{transform:translateX(0);opacity:1}}
@media (prefers-reduced-motion:reduce){.sp-promo:has(.sp-promo-cover:hover) .sp-promo-btn svg{animation:none}}
/* Shine: first a sweep over the whole card (after 25s), then every 40s only on the button */
.sp-promo-btn::after{content:"";position:absolute;top:0;bottom:0;left:0;width:55%;z-index:-1;pointer-events:none;
  background:linear-gradient(105deg,transparent 0%,rgba(255,255,255,0) 20%,rgba(255,255,255,.55) 50%,rgba(255,255,255,0) 80%,transparent 100%);
  transform:translateX(-120%) skewX(-12deg);animation:sp-shine-btn 40s ease-in-out 65s infinite}
@keyframes sp-shine-btn{0%{transform:translateX(-120%) skewX(-12deg)}3%{transform:translateX(220%) skewX(-12deg)}100%{transform:translateX(220%) skewX(-12deg)}}
.sp-promo::after{content:"";position:absolute;top:-10%;bottom:-10%;left:0;width:45%;z-index:4;pointer-events:none;
  background:linear-gradient(105deg,transparent 0%,rgba(255,255,255,0) 25%,rgba(255,255,255,.28) 50%,rgba(255,255,255,0) 75%,transparent 100%);
  transform:translateX(-130%) skewX(-12deg);animation:sp-shine-card 1.3s ease-in-out 25s 1 both}
@keyframes sp-shine-card{from{transform:translateX(-130%) skewX(-12deg)}to{transform:translateX(330%) skewX(-12deg)}}
@media (prefers-reduced-motion:reduce){.sp-promo-btn::after,.sp-promo::after{animation:none;display:none}}


.sp-compare{display:flex;align-items:center;justify-content:space-between;gap:12px;text-decoration:none;background:#fff;border:1.5px solid var(--line);border-radius:18px;padding:14px 14px 14px 20px;transition:border-color .15s,transform .15s}
.sp-compare small{display:block;font:500 13px Inter,sans-serif;color:var(--muted);margin-bottom:2px}
.sp-compare b{font:700 17px "Space Grotesk",sans-serif}
.sp-compare i{flex:none;width:38px;height:38px;border-radius:10px;background:#F3F1E4;display:inline-flex;align-items:center;justify-content:center;transition:background .15s,color .15s}
.sp-compare svg{width:17px;height:17px}
.sp-compare:hover{border-color:var(--dark);transform:translateY(-2px)}
.sp-compare:hover i{background:var(--dark);color:var(--green)}
.sp-mp-wrap .sp-compare{margin-top:12px}
.sp-promo-cover{position:absolute;inset:0;z-index:1;border-radius:inherit}
.sp-promo{cursor:pointer}
.sp-promo-alt{position:relative;z-index:3;display:block;text-align:center;margin:14px 0 0;font:500 14px "Space Grotesk",sans-serif;color:#C9CDBF!important;text-decoration:underline;text-underline-offset:3px;text-decoration-color:#4A5A47;transition:color .15s}
.sp-promo-alt b{display:inline-block;transition:transform .2s}
.sp-promo-alt:hover{color:var(--green)!important;text-decoration-color:var(--green)}
.sp-promo-alt:hover b{transform:translateX(3px)}
/* Mobile-only inline items */
.sp-mobile-toc,.sp-mobile-promo{display:none}


/* Course progress */
.sp-course{max-width:520px;margin:-8px 0 26px}
.sp-course-top{display:flex;justify-content:space-between;gap:12px;font:500 14px "Space Grotesk",sans-serif;color:var(--muted);margin-bottom:8px}
.sp-course-top b{color:var(--dark)}
.sp-course-bar{height:8px;border-radius:99px;background:#ECE8D3;overflow:hidden}
.sp-course-bar span{display:block;height:100%;border-radius:99px;background:var(--dark);position:relative}
.sp-course-bar span::after{content:"";position:absolute;right:0;top:0;bottom:0;width:8px;border-radius:99px;background:var(--green)}

/* Share */
.sp-share{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:14px;margin:28px 0 0;padding:18px 22px;border:1.5px solid var(--line);border-radius:20px;background:#fff}
.sp-share-lbl{font:700 17px "Space Grotesk",sans-serif}
.sp-share-btns{display:flex;flex-wrap:wrap;gap:8px}
.sp-share-btns a,.sp-copy{width:44px;height:44px;border-radius:12px;background:#F3F1E4;color:var(--dark);display:inline-flex;align-items:center;justify-content:center;border:0;cursor:pointer;transition:background .15s,color .15s,transform .15s}
.sp-share-btns svg{width:20px;height:20px}
.sp-share-btns a:hover,.sp-copy:hover{background:var(--dark);color:var(--green);transform:translateY(-2px)}
.sp-copy{width:auto;padding:0 16px;gap:8px;font:700 14px "Space Grotesk",sans-serif}
.sp-copy.is-done{background:var(--green);color:var(--dark)}

/* Donate */
.sp-donate{position:relative;display:grid;grid-template-columns:auto 1fr;gap:26px;align-items:start;margin:28px 0 0;padding:34px 36px;border-radius:24px;
  background:var(--donate-bg);overflow:hidden}
.sp-donate-heart{width:64px;height:64px;border-radius:18px;background:var(--dark);color:var(--donate);display:flex;align-items:center;justify-content:center}
.sp-donate-heart svg{width:32px;height:32px;animation:sp-beat 1.6s ease-in-out infinite}
@keyframes sp-beat{0%,100%{transform:scale(1)}12%{transform:scale(1.25)}24%{transform:scale(1)}36%{transform:scale(1.15)}48%{transform:scale(1)}}
.sp-donate h3{font:700 26px/1.15 "Space Grotesk",sans-serif;letter-spacing:-.01em;margin:4px 0 10px}
.sp-donate p:not(.sp-label){font-size:16px;line-height:1.65;color:#3A3F37;margin:0 0 18px}
.sp-donate-btns{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.sp-don-main{display:inline-flex;align-items:center;gap:12px;background:var(--dark);color:var(--cream)!important;text-decoration:none;border-radius:12px;padding:6px 6px 6px 18px;font:700 14px "Space Grotesk",sans-serif;text-transform:uppercase;letter-spacing:.02em;transition:transform .15s}
.sp-don-main span{width:34px;height:34px;border-radius:9px;background:var(--donate);color:var(--dark);display:inline-flex;align-items:center;justify-content:center}
.sp-don-main svg{width:17px;height:17px}
.sp-don-main:hover{transform:translateY(-2px)}
.sp-don-main:hover svg{animation:sp-beat 1s ease-in-out infinite}
.sp-don-alt{text-decoration:none;font:500 14px "Space Grotesk",sans-serif;padding:11px 14px;border-radius:12px;border:1.5px solid rgba(18,28,19,.18);transition:border-color .15s}
.sp-don-alt:hover{border-color:var(--dark)}
.sp-donate .sp-label{color:rgba(18,28,19,.55)}

/* Author */
.sp-author{display:grid;grid-template-columns:auto 1fr;gap:24px;align-items:start;margin:28px 0 0;padding:30px 32px;border:1.5px solid var(--line);border-radius:24px;background:#fff}
.sp-avatar{width:76px;height:76px;border-radius:50%;object-fit:cover;object-position:50% 50%;box-shadow:0 0 0 4px #fff,0 0 0 5.5px var(--dark)}
.sp-author h3{font:700 26px/1.15 "Space Grotesk",sans-serif;letter-spacing:-.01em;margin:2px 0 8px}
.sp .sp-author-bio{font-size:16px;line-height:1.65;color:#3A3F37;margin:0 0 14px}
.sp .sp-author-bio + .sp-author-links{margin-top:18px}
.sp-donate .sp-donate-in p:not(.sp-label){margin-bottom:12px}
.sp-donate .sp-donate-in p:not(.sp-label):last-of-type{margin-bottom:18px}
.sp-donate p b{font-weight:600;color:var(--dark)}
.sp .sp-author-bio b{font-weight:600;color:var(--dark)}
.sp-author-links{display:flex;flex-wrap:wrap;align-items:center;gap:6px 18px}
.sp-author-links a{font:700 14px "Space Grotesk",sans-serif;text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1.5px}
.sp-author-links a:first-child{text-decoration:none;background:var(--dark);color:var(--cream)!important;padding:8px 14px;border-radius:10px;margin-right:4px}

/* Back to top */
.sp-top{position:fixed;right:22px;bottom:22px;z-index:1500;width:56px;height:56px;border:0;padding:0;border-radius:50%;background:var(--dark);color:var(--cream);cursor:pointer;
  display:flex;align-items:center;justify-content:center;opacity:0;visibility:hidden;transform:translateY(12px);transition:opacity .25s,transform .25s,visibility .25s;box-shadow:0 10px 24px rgba(18,28,19,.25)}
.sp-top.is-visible{opacity:1;visibility:visible;transform:none}
.sp-top:hover{transform:translateY(-3px)}
.sp-top-ring{position:absolute;inset:0;width:100%;height:100%;transform:rotate(-90deg)}
.sp-top-ring circle{fill:none;stroke:#2A382B;stroke-width:3}
.sp-top-ring .sp-top-fill{stroke:var(--green);stroke-dasharray:157.1;stroke-dashoffset:157.1;stroke-linecap:round}
.sp-top-arrow{position:relative;width:20px;height:20px}
.sp-top:hover .sp-top-arrow{animation:sp-up .5s ease-in-out}
@keyframes sp-up{0%,100%{transform:translateY(0)}45%{transform:translateY(-140%);opacity:0}55%{transform:translateY(140%);opacity:0}}

@media (max-width:600px){
  .sp-course-top span:last-child{display:none}
  .sp-donate{grid-template-columns:1fr;padding:26px 22px;gap:16px}
  .sp-author{grid-template-columns:1fr;padding:26px 22px;gap:16px}
  .sp-share{padding:16px}
  .sp-top{right:14px;bottom:14px;width:50px;height:50px}
}

/* Explore + further reading */
.sp-explore{margin:80px 0 0}
.sp-explore h2,.sp-further h2{font:700 30px "Space Grotesk",sans-serif;letter-spacing:-.015em;margin:0 0 18px}
.sp-explore .sp-pill{font-size:17px;padding:12px 22px}
.sp-courses{position:relative;margin:90px 0 0;background:var(--dark);color:var(--cream);border-radius:32px;padding:64px clamp(24px,5vw,64px) 72px;overflow:hidden}
.sp-courses::before{content:"";position:absolute;right:-120px;top:-160px;width:420px;height:420px;border-radius:50%;background:radial-gradient(circle,color-mix(in srgb,var(--green) 18%,transparent),transparent 65%)}
.sp-courses-head{position:relative;max-width:720px;margin:0 0 44px}
.sp-courses-lbl{font:500 13px "Space Grotesk",sans-serif;letter-spacing:.08em;text-transform:uppercase;color:#8F9A88;margin:0 0 14px}
.sp-courses h2{font:400 clamp(48px,7vw,96px)/.9 Anton,sans-serif;text-transform:uppercase;margin:0 0 20px;color:var(--cream)}
.sp-courses h2 span{color:var(--green)}
.sp-courses-sub{font-size:17.5px;line-height:1.6;color:#C9CDBF;max-width:560px;margin:0}
.sp-cgrid{position:relative;display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.sp-ccard{position:relative;display:flex;flex-direction:column;text-decoration:none;background:var(--cc);color:var(--dark)!important;border-radius:22px;padding:24px 24px 22px;transition:transform .25s}
.sp-ccard:hover{transform:translateY(-6px) rotate(-.6deg)}
.sp-ccard-top{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:44px}
.sp-cnum{font:500 13px "Space Grotesk",sans-serif;letter-spacing:.06em;padding:5px 10px;border:1.5px solid rgba(18,28,19,.25);border-radius:999px}
.sp-cbub{font:700 14px "Space Grotesk",sans-serif;background:var(--dark);color:var(--cream);padding:7px 12px;border-radius:12px;border-bottom-right-radius:3px;transform:rotate(2deg)}
.sp-ccard h3{font:400 34px/.95 Anton,sans-serif;text-transform:uppercase;margin:0 0 12px}
.sp-ccard p{font-size:15.5px;line-height:1.55;margin:0 0 20px;color:#2E362B;flex:1}
.sp-cprice{display:flex;align-items:baseline;gap:10px;margin:0 0 14px}
.sp-cprice b{font:700 30px/1 "Space Grotesk",sans-serif;letter-spacing:-.02em}
.sp-cprice s{font:500 18px "Space Grotesk",sans-serif;color:rgba(18,28,19,.5);text-decoration-thickness:2px}
.sp-cbtn{display:flex;align-items:center;justify-content:space-between;background:var(--dark);color:var(--cream);border-radius:12px;padding:6px 6px 6px 18px;font:700 14px "Space Grotesk",sans-serif;text-transform:uppercase;letter-spacing:.02em}
.sp-cbtn i{width:36px;height:36px;border-radius:9px;background:var(--cream);color:var(--dark);display:inline-flex;align-items:center;justify-content:center;overflow:hidden}
.sp-cbtn svg{width:17px;height:17px}
/* Same hover feel as the header "Paid courses" button */
.sp-cbtn{position:relative;overflow:hidden;isolation:isolate;transition:color .3s,box-shadow .3s}
.sp-cbtn::before{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;background:var(--cream);transform:scaleX(0);transform-origin:right;transition:transform .4s cubic-bezier(.7,0,.2,1)}
.sp-ccard:hover .sp-cbtn{color:var(--dark);box-shadow:inset 0 0 0 1.5px var(--dark)}
.sp-ccard:hover .sp-cbtn::before{transform:scaleX(1)}
.sp-cbtn i{transition:background .3s,color .3s}
.sp-ccard:hover .sp-cbtn i{background:var(--dark);color:var(--cream)}
.sp-ccard:hover .sp-cbtn svg{animation:sp-arrow .45s ease-in-out}
.sp-ccard-best{box-shadow:0 0 0 3px var(--cream)}
.sp-cbadge{position:absolute;top:-14px;left:22px;background:var(--cream);color:var(--dark);font:700 12px "Space Grotesk",sans-serif;letter-spacing:.06em;text-transform:uppercase;padding:6px 12px;border-radius:999px;box-shadow:3px 3px 0 #000}
.sp-courses-note{position:absolute;left:50%;transform:translateX(-50%);bottom:calc(100% + 38px);white-space:nowrap;display:flex;align-items:flex-start;gap:2px;color:var(--green);pointer-events:none}
.sp-courses-note svg{width:46px;height:56px;margin:10px 0 -18px}
.sp-courses-note span{font:700 26px/1 Caveat,cursive;transform:rotate(-5deg)}
.sp-courses-head{margin-bottom:104px}


@media (max-width:1000px){
  .sp-grid{grid-template-columns:1fr}
  .sp-side{display:none}
  .sp-mobile-toc,.sp-mobile-promo{display:block}
  .sp-mobile-toc{border:1.5px solid var(--line);border-radius:18px;background:#fff;margin:0 0 24px}
  .sp-mobile-toc summary{list-style:none;cursor:pointer;padding:16px 20px;font:700 16px "Space Grotesk",sans-serif;display:flex;justify-content:space-between}
  .sp-mobile-toc summary::-webkit-details-marker{display:none}
  .sp-mobile-toc summary::after{content:"▾"}
  .sp-mobile-toc[open] summary::after{content:"▴"}
  .sp-mobile-toc .sp-toc{border:0;padding:0 20px 14px;background:none}
  .sp-mobile-promo{margin:28px 0 0}
  .sp-mobile-promo{container-type:inline-size}
  .sp-mp-wrap{position:relative;max-width:420px;margin:0 auto}
  .sp-scribble{display:none;position:absolute;right:calc(100% + 14px);top:84px;width:240px;color:var(--dark);text-align:right}
  .sp-scribble span{display:block;font:700 28px/1 Caveat,cursive;transform:rotate(-6deg);margin:0 60px -6px 0;white-space:nowrap;position:relative}
  .sp-scribble svg{width:120px;height:70px;margin-left:auto;display:block}
  @container (min-width:800px){.sp-scribble{display:block}}

  .sp-cgrid{grid-template-columns:1fr}
  .sp-ccard-top{margin-bottom:24px}
  .sp-cbtn{align-self:flex-start;min-width:260px;gap:28px}
  .sp-courses-note{display:none}
  .sp-courses-head{margin-bottom:36px}
  .sp-courses{padding-bottom:56px}
}
@media (max-width:600px){
  .sp-wrap{padding:32px 16px 72px}
  .sp-summary{padding:26px 22px}
  .sp-body{padding:30px 20px;border-radius:22px}
  .sp-body h2{font-size:25px}
  .sp-sheet{grid-template-columns:1fr;padding:28px 22px;gap:22px}
  .sp-sheet-art{justify-content:flex-start}
  .sp-paper{width:110px}
  .sp-form{grid-template-columns:1fr}
  .sp-jump{margin-left:0}
  .sp-nav{grid-template-columns:1fr}
  .sp-nav a:last-child{text-align:left}
  .sp-courses{border-radius:24px;padding:40px 20px 40px;margin-top:64px}
  .sp-cbtn{align-self:stretch;min-width:0}
}


/* ===== Plugin additions ===== */

/* Lite YouTube embed: only a thumbnail loads until someone clicks play */
.sp-video{padding:0;display:block}
.sp-video img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:0;max-width:none}
.sp-video .sp-play{z-index:2;border:0;padding:0;cursor:pointer;color:var(--dark)}
.sp-video .sp-v-yt{z-index:2}
.sp-video iframe{position:absolute;inset:0;width:100%;height:100%;border:0;z-index:3}
.sp-video.is-playing::before,.sp-video.is-playing .sp-play,.sp-video.is-playing .sp-v-yt{display:none}
.sp-cover-img{aspect-ratio:auto;padding:0;background:none}
.sp-cover-img img{display:block;width:100%;height:auto;border-radius:24px}

/* Post text written in the WordPress editor */
.sp-content > *:first-child{margin-top:0}
.sp-content h4{font:700 17px "Space Grotesk",sans-serif;margin:24px 0 8px}
.sp-content ul:not(.sp-checks),.sp-content ol{margin:0 0 20px;padding-left:0;list-style:none}
.sp-content ul:not(.sp-checks) > li{position:relative;padding-left:26px;margin-bottom:8px}
.sp-content ul:not(.sp-checks) > li::before{content:"";position:absolute;left:4px;top:.65em;width:9px;height:9px;border-radius:3px;background:var(--cat);box-shadow:0 0 0 1.5px var(--dark)}
.sp-content ol{counter-reset:spol}
.sp-content ol > li{position:relative;padding-left:34px;margin-bottom:8px;counter-increment:spol}
.sp-content ol > li::before{content:counter(spol);position:absolute;left:0;top:.15em;width:24px;height:24px;border-radius:7px;background:var(--cat);font:700 13px/24px "Space Grotesk",sans-serif;text-align:center;color:var(--dark)}
.sp-content a:not([class]){text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:3px;text-decoration-color:var(--cat);font-weight:600}
.sp-content a:not([class]):hover{text-decoration-color:var(--dark)}
.sp-content img{border-radius:18px;height:auto}
.sp-content figure{margin:24px 0}
.sp-content figcaption{font-size:14px;color:var(--muted);margin-top:8px;text-align:center}
.sp-content mark,.sp-content mark.has-inline-color{background:var(--cat)!important;color:inherit!important;padding:0 4px;border-radius:4px}
.sp-content hr{border:0;height:1px;background:var(--line);margin:36px 0}
.sp-content .wp-block-embed iframe{border-radius:18px;max-width:100%}
.sp-content .wp-block-image,.sp-content .wp-block-embed{margin:28px 0}
/* Quote block = dark card */
.sp-content blockquote{position:relative;background:var(--dark);color:var(--cream);border:0;border-radius:22px;padding:26px 32px;margin:34px 0}
.sp-content blockquote p{color:var(--cream)!important;font:500 20px/1.45 "Space Grotesk",sans-serif!important;margin:0 0 8px!important}
.sp-content blockquote cite{font:500 13px "Space Grotesk",sans-serif;letter-spacing:.08em;text-transform:uppercase;color:#8F9A88;font-style:normal}

/* Pattern: example sentences (group with class sp-ex, each line "<strong>Spanish</strong> English") */
.sp-ex p{display:flex;flex-wrap:wrap;gap:4px 14px;align-items:baseline;background:#FAF8EE;border-radius:12px;padding:12px 16px;margin:0!important;color:var(--muted)!important;font-size:15.5px!important;line-height:1.5!important}
.sp-ex p strong,.sp-ex p b{font:700 18px "Space Grotesk",sans-serif;color:var(--dark)}
.sp-ex > .wp-block-group__inner-container{display:grid;gap:8px;background:none;padding:0}

/* Pattern: tip card (group with class sp-tip) */
.sp-tip > .wp-block-group__inner-container > *:last-child,.sp-tip > *:last-child{margin-bottom:0!important}
.sp-tip .sp-tip-label{display:flex!important;align-items:center;gap:12px;margin:0 0 14px!important;font:500 13px "Space Grotesk",sans-serif!important;letter-spacing:.08em;text-transform:uppercase;color:#8F9A88!important}
.sp-tip .sp-tip-label::before{content:"";flex:none;width:38px;height:38px;border-radius:11px;transform:rotate(-4deg);background:var(--green) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23121C13' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 18h6M10 21h4'/%3E%3Cpath d='M12 3a6 6 0 0 0-3.6 10.8c.6.5 1 1.2 1.1 2V16h5v-.2c.1-.8.5-1.5 1.1-2A6 6 0 0 0 12 3z'/%3E%3C/svg%3E") center/20px no-repeat}
.sp-tip strong,.sp-tip b{color:var(--green)}

/* Tables from the editor */
.sp-content .wp-block-table{margin:10px 0 26px;overflow-x:auto}
.sp-content table{width:100%;border-collapse:separate;border-spacing:0;border:1px solid var(--line);border-radius:16px;overflow:hidden;font-size:16px;margin:0}
.sp-content table th,.sp-content table thead td{background:var(--cat);font:700 14px "Space Grotesk",sans-serif;text-transform:uppercase;letter-spacing:.06em;text-align:left;padding:14px 18px;border:0}
.sp-content table td{padding:13px 18px;border:0;border-top:1px solid var(--line);background:#fff;line-height:1.5;vertical-align:top}
.sp-content table tbody tr:nth-child(odd) td{background:#fff}
.sp-content table tbody tr:nth-child(even) td{background:#FBFAF3}
.sp-content table thead + tbody tr:first-child td{border-top:1px solid var(--line)}
.sp-content .wp-block-table thead{border:0}
.sp-content .wp-block-table figcaption{text-align:left}

/* Practice questions = Details blocks */
.sp-content details{border:1.5px solid var(--line);border-radius:14px;padding:14px 18px;background:#FDFCF6;margin:0 0 10px}
.sp-content details summary{cursor:pointer;font:500 17px "Space Grotesk",sans-serif;list-style:none;display:flex;justify-content:space-between;gap:12px;color:var(--dark)}
.sp-content details summary::-webkit-details-marker{display:none}
.sp-content details summary::after{content:"Show answer";flex:none;font:500 13px Inter,sans-serif;color:var(--muted);align-self:center}
.sp-content details[open] summary::after{content:"Hide"}
.sp-content details > *:not(summary){margin:10px 0 0!important;font-size:16px!important}

/* Signup form states */
.sp-hp{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important;opacity:0}
.sp-form-msg{grid-column:1/-1;margin:2px 0 0!important;font-size:14px!important;color:#B3261E!important;min-height:0}
.sp-form-msg:empty{display:none}
.sp-form.is-loading button{opacity:.6;pointer-events:none}
.sp-sheet-done h3{margin-top:4px}

/* Ads: code slot */
.sp-ad .sp-ad-code{background:none;height:auto;min-height:100px;display:block;color:inherit}

/* ===== Theme / Elementor resets (Hello theme makes buttons pink, adds table borders, etc.) ===== */
.sp button,.sp button:hover,.sp button:focus,.sp-top,.sp-top:hover,.sp-top:focus{box-shadow:none;text-decoration:none;white-space:normal}
.sp .sp-copy{border:0;background:#F3F1E4;color:var(--dark);font-size:14px;line-height:1;border-radius:12px;padding:0 16px}
.sp .sp-form input[type=text],.sp .sp-form input[type=email]{width:auto;min-width:0;background:#fff;border:1.5px solid var(--dark);border-radius:12px;padding:15px 16px;font:15px Inter,sans-serif;color:var(--dark);transition:box-shadow .15s}
.sp .sp-form button{border:0;font-size:15px;line-height:1.2;text-transform:uppercase}
.sp button:focus-visible,.sp a:focus-visible,.sp-top:focus-visible{outline:2px solid var(--dark);outline-offset:2px}
.sp .sp-copy:hover,.sp .sp-copy:focus{background:var(--dark);color:var(--green)}
.sp .sp-copy.is-done{background:var(--green);color:var(--dark)}
.sp .sp-play:hover,.sp .sp-play:focus{background:var(--green);color:var(--dark)}
.sp .sp-form button:hover,.sp .sp-form button:focus{background:var(--dark);color:var(--cream)}
.sp-top:hover,.sp-top:focus{background:var(--dark);color:var(--cream)}
#sp-main h1,#sp-main h2,#sp-main h3,#sp-main h4{color:var(--dark)}
#sp-main .sp-courses h2{color:var(--cream)}
#sp-main .sp-courses h2 span{color:var(--green)}
#sp-main .sp-promo h3{color:var(--green)}
#sp-main .sp-sheet h3,#sp-main .sp-donate h3,#sp-main .sp-author h3{color:var(--dark)}
#sp-main p{font-family:inherit}
#sp-main{font-family:Inter,sans-serif;color:var(--dark);background:transparent}
body.single-post{background:var(--cream,#FEFBEC)}

/* ===== Elementor "Site Settings" overrides =====
   Elementor's global fonts/colors/buttons (".elementor-kit-…" rules) were overriding the design.
   These rules win over them, so the blog posts always look as designed. */
#sp-main a{color:inherit}
#sp-main .sp-title{font:700 clamp(36px,5vw,60px)/1.02 "Space Grotesk",sans-serif!important;letter-spacing:-.025em!important;text-transform:none!important;color:var(--dark)!important;margin:0 0 18px!important}
#sp-main .sp-body h2{font:700 30px/1.15 "Space Grotesk",sans-serif!important;letter-spacing:-.015em!important;text-transform:none!important}
#sp-main .sp-body h3{font:700 20px/1.3 "Space Grotesk",sans-serif!important;text-transform:none!important}
#sp-main .sp-body h4{font:700 17px/1.3 "Space Grotesk",sans-serif!important;text-transform:none!important}
#sp-main .sp-sheet h3{font:700 28px/1.15 "Space Grotesk",sans-serif!important;letter-spacing:-.01em!important;text-transform:none!important}
#sp-main .sp-donate h3,#sp-main .sp-author h3{font:700 26px/1.15 "Space Grotesk",sans-serif!important;letter-spacing:-.01em!important;text-transform:none!important}
#sp-main .sp-explore h2{font:700 30px/1.2 "Space Grotesk",sans-serif!important;letter-spacing:-.015em!important;text-transform:none!important;color:var(--dark)!important}
#sp-main .sp-promo h3{font:400 32px/.95 Anton,sans-serif!important;text-transform:uppercase!important;letter-spacing:0!important;color:var(--green)!important}
#sp-main .sp-courses h2{font:400 clamp(48px,7vw,96px)/.9 Anton,sans-serif!important;text-transform:uppercase!important;letter-spacing:0!important;color:var(--cream)!important}
#sp-main .sp-courses h2 span{color:var(--green)!important}
#sp-main .sp-ccard h3{font:400 34px/.95 Anton,sans-serif!important;text-transform:uppercase!important;letter-spacing:0!important;color:var(--dark)!important}
#sp-main .sp-cover-big{font-family:Anton,sans-serif!important}
#sp-main .sp-pill{color:var(--dark)!important}

/* Buttons */
#sp-main .sp-play{background:var(--green)!important;color:var(--dark)!important;border:0!important;border-radius:50%!important;padding:0!important;width:84px!important;height:84px!important}
#sp-main .sp-copy{background:#F3F1E4!important;color:var(--dark)!important;border:0!important;border-radius:12px!important;padding:0 16px!important;height:44px;font:700 14px "Space Grotesk",sans-serif!important}
#sp-main .sp-copy:hover{background:var(--dark)!important;color:var(--green)!important}
#sp-main .sp-copy.is-done{background:var(--green)!important;color:var(--dark)!important}
#sp-main .sp-form button{background:var(--dark)!important;color:var(--cream)!important;border:0!important;border-radius:12px!important;padding:6px 6px 6px 20px!important;font:700 15px "Space Grotesk",sans-serif!important;text-transform:uppercase!important;letter-spacing:.02em!important}
#sp-main .sp-form input[type=text],#sp-main .sp-form input[type=email]{background:#fff!important;border:1.5px solid var(--dark)!important;border-radius:12px!important;padding:15px 16px!important;font:15px Inter,sans-serif!important;color:var(--dark)!important}
#sp-main .sp-mobile-toc summary{color:var(--dark)}
body .sp-top{background:var(--dark)!important;color:var(--cream)!important;border:0!important;border-radius:50%!important;padding:0!important;width:56px!important;height:56px!important}

@media (max-width:1000px){
  #sp-main .sp-ccard h3{font-size:34px!important}
}
@media (max-width:600px){
  #sp-main .sp-body h2{font-size:25px!important}
  #sp-main .sp-courses h2{font-size:clamp(40px,12vw,56px)!important}
  body .sp-top{width:50px!important;height:50px!important}
}

/* v1.0.2: centered play icon, smaller on mobile, aligned copy-link icon */
#sp-main .sp-play{display:flex!important;align-items:center!important;justify-content:center!important;line-height:0!important}
#sp-main .sp-play svg{width:34px!important;height:34px!important;margin:0!important;display:block}
#sp-main .sp-copy{display:inline-flex!important;align-items:center!important;gap:8px!important;line-height:1!important}
#sp-main .sp-copy svg{display:block;flex:none;width:18px;height:18px}
@media (max-width:600px){
  #sp-main .sp-play{width:60px!important;height:60px!important;margin:-30px 0 0 -30px!important}
  #sp-main .sp-play svg{width:26px!important;height:26px!important}
}

/* v1.0.3: tags + play button tweaks */
.sp-tags{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:32px 0 0;padding-top:24px;border-top:1px solid var(--line)}
.sp-tags-lbl{font:500 13px "Space Grotesk",sans-serif;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-right:4px}
#sp-main .sp-tag{display:inline-flex;align-items:center;gap:2px;padding:7px 14px;border-radius:999px;background:#F3F1E4;color:var(--dark)!important;text-decoration:none!important;font:500 14px "Space Grotesk",sans-serif;transition:background .15s,color .15s}
#sp-main .sp-tag span{color:var(--muted);transition:color .15s}
#sp-main .sp-tag:hover{background:var(--dark);color:var(--cream)!important}
#sp-main .sp-tag:hover span{color:var(--green)}
@media (max-width:600px){
  #sp-main .sp-play{width:52px!important;height:52px!important;margin:-26px 0 0 -26px!important}
  #sp-main .sp-play svg{width:22px!important;height:22px!important}
}

/* v1.0.4: play button in the category color (same as the summary block) */
#sp-main .sp-play,#sp-main .sp-play:hover,#sp-main .sp-play:focus{background:var(--cat)!important;color:var(--dark)!important;box-shadow:0 6px 20px rgba(0,0,0,.18)}

/* "Send me the PDF" hover (same effect as "Paid courses" in the header, reversed for a dark button):
   green fill wipes in from the arrow, text turns dark, arrow square turns dark and the arrow shoots out and back. */
#sp-main .sp-form button{position:relative;overflow:hidden;isolation:isolate;transition:transform .15s,color .3s!important}
#sp-main .sp-form button::before{content:"";position:absolute;inset:2px;z-index:-1;background:var(--green);border-radius:10px;transform:scaleX(0);transform-origin:right;transition:transform .4s cubic-bezier(.7,0,.2,1)}
#sp-main .sp-form button:is(:hover,:focus-visible){color:var(--dark)!important}
#sp-main .sp-form button:is(:hover,:focus-visible)::before{transform:scaleX(1)}
#sp-main .sp-form button span{overflow:hidden;transition:background .3s,color .3s}
#sp-main .sp-form button:is(:hover,:focus-visible) span{background:var(--dark);color:var(--green)}
#sp-main .sp-form button:hover svg{animation:sww-arrow .45s ease-in-out}
@keyframes sww-arrow{0%{transform:translateX(0)}45%{transform:translateX(160%);opacity:0}55%{transform:translateX(-160%);opacity:0}100%{transform:translateX(0);opacity:1}}
@media (prefers-reduced-motion:reduce){#sp-main .sp-form button:hover svg{animation:none}}

/* ---- Previous / next lesson ---- */
.sp-crumb-row{display:flex;align-items:center;justify-content:space-between;gap:12px 20px;flex-wrap:wrap;margin:0 0 18px}
#sp-main .sp-crumb-row .sp-crumb{margin:0}
.sp-mini-nav{display:flex;gap:6px}
#sp-main .sp-mini-nav a{display:inline-flex;align-items:center;gap:8px;height:36px;padding:0 14px;border:1.5px solid var(--line);border-radius:999px;background:#fff;color:var(--dark)!important;text-decoration:none!important;font:600 13px "Space Grotesk",sans-serif;letter-spacing:.04em;text-transform:uppercase;transition:border-color .15s,background .15s,color .15s}
#sp-main .sp-mini-nav a svg{width:15px;height:15px;transition:transform .2s}
#sp-main .sp-mini-nav a:hover{border-color:var(--dark)}
#sp-main .sp-mini-nav a:hover svg{transform:translateX(-3px)}
#sp-main .sp-mini-nav a.is-next{background:var(--dark);border-color:var(--dark);color:var(--cream)!important}
#sp-main .sp-mini-nav a.is-next svg{color:var(--green)}
#sp-main .sp-mini-nav a.is-next:hover{background:var(--green);border-color:var(--green);color:var(--dark)!important}
#sp-main .sp-mini-nav a.is-next:hover svg{color:var(--dark);transform:translateX(3px)}

#sp-main .sp-nav{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.25fr);gap:12px;margin:28px 0 0}
#sp-main .sp-nav a{position:relative;display:flex;align-items:center;gap:16px;text-decoration:none!important;border:1.5px solid var(--line);border-radius:20px;padding:18px 20px;background:#fff;color:var(--dark)!important;overflow:hidden;isolation:isolate;transition:border-color .2s,transform .15s,color .3s}
#sp-main .sp-nav-txt{flex:1;min-width:0}
#sp-main .sp-nav small{display:block;font:500 12px "Space Grotesk",sans-serif;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-bottom:5px;transition:color .3s}
#sp-main .sp-nav b{display:block;font:700 17px/1.3 "Space Grotesk",sans-serif}
#sp-main .sp-nav-sq{flex:none;width:44px;height:44px;border-radius:12px;display:inline-flex;align-items:center;justify-content:center;overflow:hidden;background:var(--cream);color:var(--dark);transition:background .3s,color .3s}
#sp-main .sp-nav-sq svg{width:19px;height:19px}
#sp-main .sp-nav a:hover{transform:translateY(-2px)}
#sp-main .sp-nav a.sp-nav-prev:hover{border-color:var(--dark)}
#sp-main .sp-nav a.sp-nav-prev:hover .sp-nav-sq svg{animation:sp-arrow-back .45s ease-in-out}
/* Next lesson: dark card, same hover as "Paid courses" in the header */
#sp-main .sp-nav a.sp-nav-next{background:var(--dark);border-color:var(--dark);color:var(--cream)!important;text-align:right}
#sp-main .sp-nav a.sp-nav-next small{color:#8F9A88}
#sp-main .sp-nav a.sp-nav-next .sp-nav-sq{background:var(--green);color:var(--dark)}
#sp-main .sp-nav a.sp-nav-next::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--green);transform:scaleX(0);transform-origin:right;transition:transform .45s cubic-bezier(.7,0,.2,1)}
#sp-main .sp-nav a.sp-nav-next:hover{color:var(--dark)!important}
#sp-main .sp-nav a.sp-nav-next:hover::before{transform:scaleX(1)}
#sp-main .sp-nav a.sp-nav-next:hover small{color:color-mix(in srgb,var(--dark) 65%,transparent)}
#sp-main .sp-nav a.sp-nav-next:hover .sp-nav-sq{background:var(--dark);color:var(--green)}
#sp-main .sp-nav a.sp-nav-next:hover .sp-nav-sq svg{animation:sww-arrow .45s ease-in-out}
@keyframes sp-arrow-back{0%{transform:translateX(0)}45%{transform:translateX(-160%);opacity:0}55%{transform:translateX(160%);opacity:0}100%{transform:translateX(0);opacity:1}}
@media (max-width:640px){
  #sp-main .sp-nav{grid-template-columns:1fr}
  #sp-main .sp-nav a.sp-nav-next{order:-1}
  .sp-mini-nav span{display:none}
  #sp-main .sp-mini-nav a{width:36px;padding:0;justify-content:center}
  #sp-main .sp-mini-nav a.is-next{width:auto;padding:0 12px}
  #sp-main .sp-mini-nav a.is-next span{display:inline}
}
@media (prefers-reduced-motion:reduce){#sp-main .sp-nav a svg{animation:none!important}}

/* Reference sheet: button + PDF badge in a dark shade of the category color */
#sp-main{--cat-dark:var(--dark)}
@supports (color:oklch(from red l c h)){#sp-main{--cat-dark:oklch(from var(--cat) .4 calc(c * 2.6) h)}}
#sp-main .sp-form{grid-template-columns:minmax(0,.75fr) minmax(0,1.25fr)}
#sp-main .sp-form button{background:var(--cat-dark)!important;color:var(--cream)!important}
#sp-main .sp-form button span{background:var(--cat);color:var(--dark)}
#sp-main .sp-form button::before{background:var(--cat)}
#sp-main .sp-form button:is(:hover,:focus-visible){color:var(--dark)!important}
#sp-main .sp-form button:is(:hover,:focus-visible) span{background:var(--cat-dark);color:var(--cream)}
#sp-main .sp-paper span{background:var(--cat-dark);color:var(--cream)}
@media (max-width:600px){#sp-main .sp-form{grid-template-columns:1fr}}

/* Course cards: price left, "See the course" right, on one line at every size.
   Narrow cards: smaller button, old bundle price above the new one. Only on very small phones the button drops below. */
.sp-ccard{container-type:inline-size}
.sp-cfoot{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:14px 12px}
.sp-cfoot .sp-cprice{margin:0}
.sp-ccard .sp-cfoot .sp-cbtn{align-self:auto;flex:none;width:auto;min-width:0;gap:18px;padding:6px 6px 6px 20px}
@container (max-width:400px){
  .sp-cfoot{align-items:center}
  .sp-cfoot .sp-cprice{flex-direction:column;align-items:flex-start;gap:0}
  .sp-cfoot .sp-cprice s{font-size:15px;line-height:1.1}
  .sp-cfoot .sp-cprice b{font-size:28px}
  .sp-ccard .sp-cfoot .sp-cbtn{gap:12px;padding:5px 5px 5px 14px;font-size:13px}
  .sp-ccard .sp-cfoot .sp-cbtn i{width:32px;height:32px}
}
/* Highlight the reference sheet when you arrive from the reference sheets page */
.sp-sheet{transition:box-shadow .5s}
.sp-sheet.sp-sheet-hl{box-shadow:0 0 0 4px var(--green),0 24px 50px -24px rgba(18,28,19,.45)}
/* lessons without a reference sheet */
.sp-sheet-none .sp-sheet-art{opacity:.45;filter:grayscale(1)}
.sp-sheet-none h3{margin-bottom:8px}
.sp-sheet-none .sp-sheet-txt{max-width:440px}

/* ---------- Lesson quiz: <div class="sp-quiz" data-quiz='[…]'></div> ---------- */
.sp-quiz{margin:30px 0 10px}
.spq-card{background:var(--dark);color:var(--cream);border-radius:26px;padding:28px 30px;min-height:280px;position:relative;overflow:hidden}
.spq-top{display:flex;justify-content:space-between;align-items:center;gap:10px;font:700 12.5px "Space Grotesk",sans-serif;color:#9AA593;letter-spacing:.08em;text-transform:uppercase}
.spq-bar{height:6px;border-radius:6px;background:rgba(254,251,236,.12);margin:12px 0 22px;overflow:hidden}.spq-bar i{display:block;height:100%;background:var(--green);transition:width .3s}
.spq-chip{display:inline-block;background:rgba(174,223,96,.15);color:var(--green);border-radius:999px;padding:4px 12px;font:700 12.5px "Space Grotesk",sans-serif;margin-bottom:12px}
.spq-q{margin:0!important;font:700 clamp(22px,2.6vw,30px)/1.25 "Space Grotesk",sans-serif!important;letter-spacing:-.02em;color:var(--cream)!important}
.spq-q b{color:var(--green)}
.spq-opts{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:20px}
.spq-opt{text-align:left;min-height:56px;border-radius:14px;border:2px solid rgba(254,251,236,.18);background:rgba(254,251,236,.05);color:var(--cream);font:700 17px "Space Grotesk",sans-serif;padding:12px 16px;cursor:pointer;transition:border-color .2s,background .2s}
.spq-opt:hover:not(:disabled){border-color:var(--green);background:rgba(174,223,96,.08)}
.spq-opt:disabled{cursor:default}
.spq-opt.ok{border-color:var(--green);background:rgba(174,223,96,.18)}
.spq-opt.bad{border-color:#F09079;background:rgba(240,144,121,.14)}
.spq-row{display:flex;gap:10px;margin-top:20px;flex-wrap:wrap}
.spq-in{flex:1 1 220px;height:56px;border-radius:14px;border:2px solid rgba(254,251,236,.2);background:rgba(254,251,236,.06);color:var(--cream);font:700 20px "Space Grotesk",sans-serif;padding:0 18px;outline:0;margin:0}
.spq-in:focus{border-color:var(--green)}
.spq-in.ok{border-color:var(--green);background:rgba(174,223,96,.15)}.spq-in.bad{border-color:#F09079;background:rgba(240,144,121,.12)}
.spq-go{height:56px;border:0;border-radius:14px;background:var(--green);color:var(--dark);font:800 14.5px "Space Grotesk",sans-serif;text-transform:uppercase;letter-spacing:.02em;padding:0 22px;cursor:pointer}
.spq-go:hover{background:#c3ea83}
.spq-acc{display:flex;gap:6px;margin-top:10px;flex-wrap:wrap}
.spq-acc button{width:40px;height:38px;border-radius:10px;border:1.5px solid rgba(254,251,236,.2);background:none;color:var(--cream);font:700 17px "Space Grotesk",sans-serif;cursor:pointer;padding:0}
.spq-acc button:hover{background:rgba(254,251,236,.1)}
.spq-fb{margin:16px 0 0!important;font-size:16px!important;min-height:24px;color:var(--cream)!important}.spq-fb b{color:var(--green)}.spq-fb .no{color:#F09079;font-weight:700}
.spq-fb small{display:block;margin-top:4px;color:#9AA593;font-size:14.5px}
.spq-next{margin-top:16px}
.spq-end{text-align:center;padding:12px 0}
.spq-score{font:800 72px/1 "Space Grotesk",sans-serif;color:var(--green)}
.spq-end p{margin:10px auto 22px!important;color:#C9CDBF!important;font-size:17px!important;max-width:420px}
.spq-btns{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
.spq-again{height:52px;border-radius:12px;border:1.5px solid rgba(254,251,236,.3);background:none;color:var(--cream);font:700 14px "Space Grotesk",sans-serif;text-transform:uppercase;padding:0 20px;cursor:pointer}
.spq-end .spq-go{height:52px;display:inline-flex;align-items:center;text-decoration:none}
@media (max-width:600px){.spq-card{padding:22px 18px;border-radius:22px}.spq-opts{grid-template-columns:1fr}}
/* quiz buttons: beat the theme's button styles */
.sp .sp-quiz button{box-shadow:none!important;text-transform:none;letter-spacing:normal;line-height:1.2;margin:0}
.sp .sp-quiz .spq-opt{background:rgba(254,251,236,.05)!important;color:var(--cream)!important;border:2px solid rgba(254,251,236,.18)!important;font:700 17px "Space Grotesk",sans-serif!important;border-radius:14px!important;padding:12px 16px!important;text-align:left!important}
.sp .sp-quiz .spq-opt:hover:not(:disabled){border-color:var(--green)!important;background:rgba(174,223,96,.08)!important}
.sp .sp-quiz .spq-opt.ok{border-color:var(--green)!important;background:rgba(174,223,96,.18)!important}
.sp .sp-quiz .spq-opt.bad{border-color:#F09079!important;background:rgba(240,144,121,.14)!important}
.sp .sp-quiz .spq-go{background:var(--green)!important;color:var(--dark)!important;border:0!important;border-radius:14px!important;font:800 14.5px "Space Grotesk",sans-serif!important;text-transform:uppercase!important;letter-spacing:.02em!important;padding:0 22px!important}
.sp .sp-quiz .spq-go:hover{background:#c3ea83!important}
.sp .sp-quiz .spq-acc button{background:transparent!important;color:var(--cream)!important;border:1.5px solid rgba(254,251,236,.2)!important;border-radius:10px!important;font:700 17px "Space Grotesk",sans-serif!important;padding:0!important}
.sp .sp-quiz .spq-acc button:hover{background:rgba(254,251,236,.1)!important}
.sp .sp-quiz .spq-again{background:transparent!important;color:var(--cream)!important;border:1.5px solid rgba(254,251,236,.3)!important;border-radius:12px!important;font:700 14px "Space Grotesk",sans-serif!important;text-transform:uppercase!important;padding:0 20px!important}
.sp .sp-quiz .spq-in{background:rgba(254,251,236,.06)!important;color:var(--cream)!important;border:2px solid rgba(254,251,236,.2)!important;border-radius:14px!important;font:700 20px "Space Grotesk",sans-serif!important;padding:0 18px!important;box-shadow:none!important}
.sp .sp-quiz .spq-in:focus{border-color:var(--green)!important}
.sp .sp-quiz .spq-in.ok{border-color:var(--green)!important;background:rgba(174,223,96,.15)!important}
.sp .sp-quiz .spq-in.bad{border-color:#F09079!important;background:rgba(240,144,121,.12)!important}
/* practice questions (show answer): stand out in the lesson colour */
.sp-content details{background:var(--cat)!important;border:0!important;border-radius:16px!important;padding:16px 16px 16px 20px!important;margin:0 0 10px!important;transition:box-shadow .2s,transform .2s}
.sp-content details:hover{box-shadow:0 10px 24px -16px rgba(18,28,19,.55)}
.sp-content details summary{font:700 17px/1.35 "Space Grotesk",sans-serif!important;align-items:center}
.sp-content details summary::after{content:"Show answer"!important;font:700 12.5px "Space Grotesk",sans-serif!important;letter-spacing:.04em;text-transform:uppercase;color:var(--green)!important;background:var(--dark);border-radius:999px;padding:8px 14px;white-space:nowrap}
.sp-content details[open] summary::after{content:"Hide"!important;background:rgba(18,28,19,.12);color:var(--dark)!important}
.sp-content details > *:not(summary){background:#fff;border-radius:12px;padding:12px 16px;margin:12px 0 0!important}
@media (max-width:600px){.sp-content details summary{flex-direction:column;align-items:flex-start;gap:10px}.sp-content details summary::after{align-self:flex-start!important}}
/* recap table teaser (full list = in the free PDF) */
.sp-content figure.sp-recap{position:relative}
.sp-content .sp-recap-ghost td span{display:inline-block;color:transparent;background:rgba(18,28,19,.08);border-radius:6px;filter:blur(1.5px);user-select:none}
.sp-content .sp-recap-ghost:nth-of-type(n){opacity:.7}
.sp-content figure.sp-recap table{margin-bottom:0!important;-webkit-mask-image:linear-gradient(#000 65%,rgba(0,0,0,.25));mask-image:linear-gradient(#000 65%,rgba(0,0,0,.25))}
.sp-content .sp-recap-cta{position:relative;margin:-56px auto 0;max-width:440px;background:var(--dark);color:var(--cream);border-radius:20px;padding:22px 24px;text-align:center;box-shadow:0 20px 40px -20px rgba(18,28,19,.6)}
.sp-content .sp-recap-cta p{margin:0!important;color:inherit!important}
.sp-content .sp-recap-t{font:800 22px/1.2 "Space Grotesk",sans-serif!important;color:var(--green)!important}
.sp-content .sp-recap-cta p.sp-recap-s{margin:8px 0 16px!important;font-size:15px!important;color:#C9CDBF!important;line-height:1.5!important}
.sp-content .sp-recap-s b{color:var(--cream)}
.sp-content .sp-recap-btn{display:inline-flex;align-items:center;gap:10px;background:var(--green);color:var(--dark)!important;border-radius:12px;padding:12px 18px;font:800 14px "Space Grotesk",sans-serif;text-transform:uppercase;letter-spacing:.02em;text-decoration:none!important}
.sp-content .sp-recap-btn span{display:inline-flex;width:24px;height:24px;border-radius:7px;background:var(--dark);color:var(--green);align-items:center;justify-content:center}
.sp-content .sp-recap-btn:hover{background:#c3ea83}
.sp-form[hidden],.sp-sheet-done[hidden]{display:none!important}

/* Early access: video is members-only until its date */
.sp-video.sp-video-early{display:flex;cursor:default;align-items:center;justify-content:center;padding:28px;text-align:center}
.sp-video.sp-video-early::before{background:rgba(18,28,19,.78);z-index:1}
.sp-video.sp-video-early img{filter:blur(6px);transform:scale(1.08)}
.sp-ea{position:relative;z-index:2;max-width:520px;color:var(--cream)}
.sp-ea-tag{display:inline-flex;align-items:center;gap:7px;font:600 12px/1 "Space Grotesk",sans-serif;letter-spacing:.08em;text-transform:uppercase;background:var(--green);color:var(--dark);padding:7px 12px 7px 10px;border-radius:99px}
.sp-ea-tag svg{width:14px;height:14px}
.sp .sp-ea-title{font:700 clamp(22px,3vw,32px)/1.12 "Space Grotesk",sans-serif;letter-spacing:-.015em;color:var(--cream);margin:16px 0 8px}
.sp .sp-ea-text{font:400 15px/1.5 Inter,sans-serif;color:var(--cream);opacity:.8;margin:0 0 20px}
.sp-ea-btns{display:flex;flex-wrap:wrap;gap:10px;justify-content:center}
.sp .sp-ea-btn{display:inline-block;font:600 15px/1 "Space Grotesk",sans-serif;text-decoration:none;padding:13px 20px;border-radius:99px;background:var(--green);color:var(--dark);transition:transform .15s}
.sp .sp-ea-btn2{background:transparent;color:var(--cream);box-shadow:inset 0 0 0 1.5px rgba(254,251,236,.45)}
.sp .sp-ea-btn:hover{transform:translateY(-2px)}
@media(max-width:640px){.sp-video.sp-video-early{aspect-ratio:auto;min-height:0;padding:34px 20px}}
.sp a.sp-ea-btn{color:var(--dark)!important}.sp a.sp-ea-btn2{color:var(--cream)!important}

/* Next lesson still early access: greyed out with a lock, links to the early access page */
#sp-main .sp-nav a.sp-nav-next.is-locked{background:#F1EEDD;border:1.5px dashed #CFC9AE;color:color-mix(in srgb,var(--dark) 55%,transparent)!important}
#sp-main .sp-nav a.sp-nav-next.is-locked small{color:var(--muted)}
#sp-main .sp-nav a.sp-nav-next.is-locked .sp-nav-sq{background:var(--dark);color:var(--green)}
#sp-main .sp-nav a.sp-nav-next.is-locked::before{display:none}
#sp-main .sp-nav a.sp-nav-next.is-locked:hover{color:var(--dark)!important;border-color:var(--dark)}
#sp-main .sp-nav a.sp-nav-next.is-locked:hover .sp-nav-sq svg{animation:none}
#sp-main .sp-nav-lock-txt{display:block;font:500 13px/1.35 Inter,sans-serif;font-style:normal;color:var(--muted);margin-top:6px}
#sp-main .sp-mini-nav a.is-locked{background:#F1EEDD;border-style:dashed;color:var(--muted)!important}
#sp-main .sp-mini-nav a.is-locked:hover svg{transform:none}
#sp-main .sp-nav b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
@media (min-width:641px){#sp-main .sp-nav{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}#sp-main .sp-nav b{font-size:16px}}

/* Early access pop-up (locked next lesson) */
@font-face{font-family:"SWW Bricolage";font-style:normal;font-weight:800;font-display:swap;src:url(../fonts/bricolage-grotesque-latin-800-normal.woff2) format("woff2")}
@font-face{font-family:"SWW Serif";font-style:italic;font-weight:400;font-display:swap;src:url(../fonts/instrument-serif-latin-400-italic.woff2) format("woff2")}
.sp-eapop{position:fixed;inset:0;z-index:100000;display:flex;align-items:center;justify-content:center;padding:16px;background:rgba(18,28,19,.55);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);opacity:0;transition:opacity .25s}
.sp-eapop.on{opacity:1}
.sp-eapop[hidden]{display:none}
.sp-eapop-box{position:relative;width:min(720px,100%);max-height:calc(100vh - 32px);overflow:auto;border-radius:32px;background:#E7E0F7;color:#121C13;padding:44px clamp(24px,4vw,48px);box-shadow:0 40px 80px -30px rgba(0,0,0,.6);transform:translateY(16px) scale(.97);transition:transform .3s cubic-bezier(.2,.9,.3,1.2);text-align:left}
.sp-eapop.on .sp-eapop-box{transform:none}
.sp-eapop-x{position:absolute;top:16px;right:16px;width:42px;height:42px;border-radius:50%;border:0;background:#121C13;color:#FEFBEC;font:400 26px/1 Inter,sans-serif;cursor:pointer;padding:0}
.sp-eapop-l{position:absolute;top:22px;right:70px;display:flex;align-items:center;gap:6px;max-width:calc(100% - 240px);margin:0;font:500 14px Inter,sans-serif;color:#3F473C;background:rgba(255,255,255,.7);border-radius:999px;padding:6px 12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sp-eapop-l svg{flex:none;width:14px;height:14px;color:#D9A21B}
.sp-eapop-ico{width:56px;height:56px;border-radius:16px;background:#121C13;color:#C9B8F2;display:flex;align-items:center;justify-content:center;margin-bottom:18px}
.sp-eapop-ico svg{width:26px;height:26px}
.sp-eapop .sp-eapop-tag{margin:0 0 10px;font:500 13px "Space Grotesk",sans-serif;letter-spacing:.12em;text-transform:uppercase;color:#3F473C}
.sp-eapop h3{margin:0 0 12px;font:800 clamp(28px,3.6vw,40px)/1.05 "SWW Bricolage","Space Grotesk",sans-serif;letter-spacing:-.04em;color:#121C13}
.sp-eapop h3 em{font-family:"SWW Serif",Georgia,serif;font-style:italic;font-weight:400;letter-spacing:-.01em;color:#6A4FB8}
.sp-eapop .sp-eapop-txt{margin:0 0 20px;max-width:520px;font:400 17px/1.55 Inter,sans-serif;color:#3F473C}
.sp-eapop-list{list-style:none;padding:0;margin:0 0 22px;display:flex;flex-wrap:wrap;gap:8px}
.sp-eapop-list li{background:rgba(255,255,255,.6);border-radius:999px;padding:6px 14px;font:600 14px "Space Grotesk",sans-serif;margin:0}
.sp-eapop-btns{display:flex;flex-wrap:wrap;gap:10px}
.sp-eapop a.sp-eabtn{position:relative;display:inline-flex;align-items:center;gap:18px;border-radius:12px;padding:6px 6px 6px 20px;font:700 15px/1 "Space Grotesk",sans-serif;text-transform:uppercase;letter-spacing:.02em;overflow:hidden;isolation:isolate;white-space:nowrap;text-decoration:none!important;color:#fff!important;transition:color .3s}
.sp-eabtn>span{width:42px;height:42px;border-radius:9px;display:inline-flex;align-items:center;justify-content:center;background:#C9B8F2;color:#2A1D5C;transition:background .3s}
.sp-eabtn svg{width:18px;height:18px}
.sp-eabtn::before{content:"";position:absolute;inset:2px;z-index:-1;border-radius:10px;transform:scaleX(0);transform-origin:right;transition:transform .4s cubic-bezier(.7,0,.2,1)}
.sp-eabtn:hover::before{transform:scaleX(1)}
.sp-eabtn:hover>span{background:#fff}
.sp-eabtn-pat{background:#4A3593}.sp-eabtn-pat::before{background:#2A1D5C}
.sp-eabtn-yt{background:#2A1D5C}.sp-eabtn-yt::before{background:#4A3593}
.sp-eapop a.sp-eapop-more{display:inline-block;margin-top:18px;font:600 14px Inter,sans-serif;color:#4A3593!important;text-decoration:underline!important;text-underline-offset:3px}
@media (max-width:600px){.sp-eapop-box{border-radius:24px;padding:26px 20px}.sp-eapop-l{position:static;max-width:none;margin:0 0 14px;background:#FEFBEC;display:inline-flex}.sp-eapop a.sp-eabtn{width:100%;justify-content:space-between}}
body .sp-eapop .sp-eapop-box h3{font:800 clamp(30px,4vw,44px)/1.04 "SWW Bricolage","Space Grotesk",sans-serif!important;letter-spacing:-.04em!important;margin:0 0 14px!important;color:#121C13!important}
body .sp-eapop .sp-eapop-box h3 em{font:italic 400 1em/1 "SWW Serif",Georgia,serif!important;color:#6A4FB8!important}
body .sp-eapop button.sp-eapop-x,body .sp-eapop button.sp-eapop-x:hover,body .sp-eapop button.sp-eapop-x:focus{background:#121C13!important;color:#FEFBEC!important;border:0!important;border-radius:50%!important;width:42px;height:42px;padding:0!important;font:400 26px/1 Inter,sans-serif!important;box-shadow:none!important}
/* Paid courses: "Coming soon" pill instead of a price */
.sp-cprice.sp-csoon span{display:inline-block;font:700 13px/1 "Space Grotesk",sans-serif;letter-spacing:.08em;text-transform:uppercase;color:var(--dark);border:2px dashed color-mix(in srgb,var(--dark) 45%,transparent);border-radius:12px;padding:10px 16px}
/* Sidebar card colors (light card, dark top): early access = purple, donate = rose/coral */
.sp-promo.is-early{background:#C9B8F2;color:#2A1F55}
.sp .sp-promo.is-early{color:#2A1F55}
.sp-promo.is-early .sp-promo-photo{background:#2A1F55 radial-gradient(circle at 85% 20%,#47358E 0,transparent 45%)}
.sp-promo.is-early .sp-bub-1{background:#C9B8F2;color:#2A1F55}
.sp-promo.is-early .sp-bub-2{box-shadow:3px 3px 0 #C9B8F2}
.sp-promo.is-early .sp-bub-2 em{color:#6A4FB8}
.sp-promo.is-early .sp-bub-3{box-shadow:3px 3px 0 #2A1F55}
.sp-promo.is-early small{color:#47358E}
#sp-main .sp-promo.is-early h3,.sp-promo.is-early h3{color:#2A1F55!important}
.sp-promo.is-early li::before{background:rgba(42,31,85,.14) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%232A1F55' stroke-width='2.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 10.5l3.2 3L15 7'/%3E%3C/svg%3E") center/14px no-repeat}
.sp-promo.is-early .sp-promo-btn{background:#2A1F55;color:#FEFBEC}
.sp-promo.is-early .sp-promo-btn span{background:#C9B8F2;color:#2A1F55}
.sp-promo.is-early .sp-promo-btn::before{background:#FEFBEC}
.sp-promo.is-early:has(.sp-promo-cover:hover) .sp-promo-btn{color:#2A1F55}
.sp-promo.is-early:has(.sp-promo-cover:hover) .sp-promo-btn span{background:#2A1F55;color:#FEFBEC}
.sp-promo.is-early .sp-promo-alt{color:#2A1F55!important;text-decoration-color:#47358E}
.sp-promo.is-early .sp-promo-alt:hover{color:#2A1F55!important}
.sp-promo.is-donate{background:#F2E4DC;color:#121C13}
.sp .sp-promo.is-donate{color:#121C13}
.sp-promo.is-donate .sp-promo-photo{background:#2E1712 radial-gradient(circle at 85% 20%,#8A3A28 0,transparent 50%)}
.sp-promo.is-donate .sp-bub-1{background:#F2E4DC;color:#121C13}
.sp-promo.is-donate .sp-bub-2{box-shadow:3px 3px 0 #F2E4DC}
.sp-promo.is-donate .sp-bub-2 em{color:#C4553D}
.sp-promo.is-donate .sp-bub-3{box-shadow:3px 3px 0 #121C13}
.sp-promo.is-donate small{color:#7A4A3C}
#sp-main .sp-promo.is-donate h3,.sp-promo.is-donate h3{color:#C4553D!important}
.sp-promo.is-donate li::before{background:rgba(196,85,61,.16) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%23121C13' stroke-width='2.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 10.5l3.2 3L15 7'/%3E%3C/svg%3E") center/14px no-repeat}
.sp-promo.is-donate .sp-promo-btn{background:#121C13;color:#FEFBEC}
.sp-promo.is-donate .sp-promo-btn span{background:#F2E4DC;color:#121C13}
.sp-promo.is-donate .sp-promo-btn::before{background:#FEFBEC}
.sp-promo.is-donate:has(.sp-promo-cover:hover) .sp-promo-btn{color:#121C13}
.sp-promo.is-donate:has(.sp-promo-cover:hover) .sp-promo-btn span{background:#121C13;color:#FEFBEC}
.sp-promo.is-donate .sp-promo-alt{color:#121C13!important;text-decoration-color:#7A4A3C}
.sp-promo.is-donate .sp-promo-alt:hover{color:#C4553D!important}
/* Card button: only as wide as its text + arrow */
.sp-promo .sp-promo-btn{display:inline-flex;justify-content:flex-start;gap:22px;width:auto;max-width:100%}
.sp-promo .sp-promo-alt{text-align:left;padding-left:2px}
/* Tip for new subscribers (lessons 1–5) */
.sp .sp-sheet-first{display:flex;gap:10px;align-items:flex-start;margin:-6px 0 18px!important;background:rgba(255,255,255,.55);border:1.5px dashed rgba(18,28,19,.25);border-radius:14px;padding:11px 14px;font:500 14.5px/1.45 Inter,sans-serif!important;color:#30392d!important;max-width:520px}
.sp .sp-sheet-first b{color:#121C13}
.sp .sp-sheet-first{margin:16px 0 0!important}