:root {
  --paper: #fff6e8;
  --ink: #19171a;
  --purple: #6638e8;
  --lime: #d8f536;
  --line: #c8bfb1;
  --body: Inter, "Open Sans", Arial, sans-serif;
  --display: "Barlow Condensed", "Liberation Sans Narrow", "Arial Narrow", Arial, sans-serif;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--paper); color: var(--ink); font: 16px/1.6 var(--body); }
h1, h2, h3, p, blockquote { margin: 0; }
a { color: inherit; }
a:focus-visible, summary:focus-visible { outline: 3px solid #a780ff; outline-offset: 4px; }
[hidden] { display: none !important; }
.skip { position: fixed; z-index: 2; top: 10px; left: 10px; padding: 12px; background: var(--lime); transform: translateY(-150%); }
.skip:focus { transform: translateY(0); }
.wrap { width: min(100% - 96px, 1216px); margin-inline: auto; }
.header, .footer { display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.header { min-height: 88px; border-bottom: 1px solid var(--ink); }
.logo { display: block; width: 108px; }
nav { display: flex; align-items: center; gap: 29px; }
nav a { text-decoration: none; font-weight: 750; font-size: .87rem; }
nav a:hover { text-decoration: underline; }
.hero { display: grid; grid-template-columns: 1.1fr 1fr; gap: clamp(30px, 5vw, 82px); align-items: center; padding-block: clamp(42px, 6vw, 84px); }
.label { font: 700 .75rem/1.25 ui-monospace, "Courier New", monospace; letter-spacing: .085em; }
.kicker, .tab { display: inline-block; padding: 7px 10px; background: var(--lime); color: var(--ink); border-radius: 3px; }
h1, h2 { font-family: var(--display); font-style: italic; font-weight: 900; text-transform: uppercase; letter-spacing: -.041em; line-height: .98; }
h1 { margin: 24px 0; font-size: clamp(3.05rem, 5.15vw, 5.45rem); }
h1 em { color: var(--purple); }
h2 { font-size: clamp(2.45rem, 4.8vw, 4.8rem); }
h3 { font-size: 1.15rem; line-height: 1.3; }
.lead, .intro { max-width: 53ch; font-size: clamp(1rem, 1.55vw, 1.19rem); }
.actions { display: flex; align-items: center; flex-wrap: wrap; gap: 16px 22px; margin-top: 25px; }
.button { display: inline-flex; gap: 16px; align-items: center; justify-content: center; padding: 12px 17px; min-height: 48px; border: 1px solid var(--ink); border-radius: 5px; background: var(--lime); color: var(--ink); font-weight: 800; line-height: 1.25; text-decoration: none; box-shadow: 3px 3px var(--ink); }
.button:hover { background: #e5ff57; transform: translateY(-2px); box-shadow: 3px 5px var(--ink); text-decoration: none; }
.button:active { transform: translateY(1px); box-shadow: 1px 1px var(--ink); }
.button.small { min-height: 38px; gap: 8px; padding: 8px 11px; }
.text-link { font-size: .88rem; font-weight: 750; text-underline-offset: 4px; }
.fine { margin-top: 13px; font-size: .81rem; color: #51494e; }
.pass { min-width: 0; padding: 16px 20px; color: white; background: var(--purple); border: 1px solid var(--ink); border-radius: 15px; box-shadow: 6px 6px var(--ink); overflow: hidden; }
.pass-top, .pass-bottom { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.pass-top { padding-bottom: 13px; border-bottom: 1px dashed #e2d7ff; }
.pass-art { min-height: 0; position: relative; isolation: isolate; display: grid; place-items: center; overflow: hidden; padding: 28px 16px; }
.rings { z-index: -1; position: absolute; inset: 0; background: repeating-radial-gradient(circle at center, transparent 0 37px, #ffffff2c 38px, transparent 39px 59px); }
.cover { width: min(63%, 265px); height: auto; border: 1px solid var(--ink); transform: rotate(-7deg); box-shadow: 10px 14px #1f124a; }
.sticker { position: absolute; right: 5%; bottom: 12%; padding: 12px 14px; color: var(--ink); background: var(--lime); transform: rotate(8deg); box-shadow: 3px 3px var(--ink); border: 1px solid var(--ink); }
.pass-bottom { border-top: 1px dashed #e2d7ff; padding-top: 13px; }
.pass-bottom i { width: 58px; height: 15px; background: repeating-linear-gradient(90deg, white 0 2px, transparent 2px 4px, white 4px 5px, transparent 5px 8px); }
.tape { background: var(--lime); border-block: 1px solid var(--ink); }
.tape .wrap { display: flex; justify-content: space-between; gap: 12px; padding-block: 13px; }
.section { padding-block: clamp(46px, 7vw, 92px); }
.eyebrow { color: #5529cc; margin-bottom: 12px; }
.intro { margin-top: 15px; }
.grid { display: grid; gap: 16px; margin-top: 28px; }
.three { grid-template-columns: repeat(3, 1fr); }
.grid article { min-width: 0; padding: 21px; border: 1px solid var(--line); border-radius: 8px; }
.grid article h3 { margin: 13px 0 7px; }
.gigs article { background: #fffaf1; }
.perk { display: flex; align-items: center; gap: 12px; margin-top: 20px; font-size: .91rem; }
.dark { background: var(--ink); color: var(--paper); }
.inside, .faq { display: grid; grid-template-columns: .9fr 1.1fr; gap: clamp(26px, 6vw, 85px); }
.dark .eyebrow, .steps .label { color: var(--lime); }
.steps { padding: 0; margin: 0; list-style: none; }
.steps li { display: grid; grid-template-columns: 29px 1fr; gap: 14px; padding: 15px 0; border-top: 1px dashed #817982; }
.steps li:last-child { border-bottom: 1px dashed #817982; }
.steps .label { padding-top: 5px; }
.steps p { margin-top: 3px; color: #e2d9dd; }
.samples { margin-bottom: 24px; }
.samples article { background: white; border: 1px solid var(--ink); box-shadow: 3px 3px var(--line); }
.samples .tab { background: #ece5ff; color: #4921b2; }
blockquote, .sample-note { font-size: .91rem; }
.tracker { margin: 0; padding: 0; list-style: none; font-size: .9rem; }
.tracker li { border-bottom: 1px dashed var(--line); padding-block: 3px; }
.founder { background: #eae0ff; border-block: 1px solid var(--ink); }
.founder-grid { display: grid; grid-template-columns: .8fr 1.2fr; gap: 28px; align-items: center; }
.founder-grid .intro { margin: 0; }
.handle { margin-top: 10px; }
.questions details { border-top: 1px solid var(--line); padding: 15px 0; }
.questions details:last-child { border-bottom: 1px solid var(--line); }
.questions summary { cursor: pointer; font-weight: 750; }
.questions details p { margin: 9px 0 0; }
.order { padding-top: 0; }
.order-ticket { display: grid; grid-template-columns: 1fr minmax(210px, .38fr); border: 1px solid var(--ink); border-radius: 12px; overflow: hidden; background: var(--purple); color: white; box-shadow: 5px 5px var(--ink); }
.order-ticket > div { padding: clamp(22px, 4vw, 50px); }
.order-ticket .eyebrow { color: var(--lime); }
.order-ticket h2 + p { margin-top: 10px; }
.price { border-left: 1px dashed #e2d7ff; text-align: center; align-self: stretch; display: grid; align-content: center; justify-items: center; gap: 8px; }
.price strong { font: italic 900 4.2rem/.93 var(--display); }
.availability { font-size: .81rem; }
.footer { border-top: 1px solid var(--line); padding-block: 24px; font-size: .77rem; }
.footer .logo { width: 82px; }
@media (max-width: 880px) {
  .wrap { width: calc(100% - 48px); }
  .hero { gap: 29px; }
  .actions { gap: 13px; }
}
@media (max-width: 670px) {
  .wrap { width: calc(100% - 36px); }
  .header { min-height: 69px; }
  .nav-detail { display: none; }
  .logo { width: 92px; }
  .hero, .inside, .faq, .founder-grid, .order-ticket, .three { grid-template-columns: 1fr; }
  .hero { padding-block: 32px 40px; }
  h1 { margin-block: 18px; }
  .pass { margin-right: 5px; }
  .cover { width: min(56%, 220px); }
  .tape .wrap { flex-wrap: wrap; justify-content: center; gap: 7px 16px; }
  .tape span { font-size: .64rem; }
  .price { border-left: 0; border-top: 1px dashed #e2d7ff; }
  .order-ticket { margin-right: 4px; }
  .footer { flex-wrap: wrap; gap: 10px; }
  .footer p { order: 3; flex-basis: 100%; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
}

/* Roles, earning examples, flexibility, and the complete offer. */
.flex-promise { margin-top: 22px; font-size: .94rem; }
.source-note { margin-top: 18px; font-size: .83rem; line-height: 1.6; color: #51494e; max-width: 95ch; }
.role-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin-top: 24px; }
.role { display: flex; flex-direction: column; gap: 13px; padding: 21px; border: 1px solid var(--ink); border-radius: 8px; background: #fffaf1; }
.role > .label { min-height: 2.5em; }
.role-rate { color: #5529cc; font: 900 1.8rem/1.2 var(--display); }
.role-rate span { display: block; margin-top: 3px; font: 500 .82rem/1.3 var(--body); }
.role > p:not(.label):not(.role-rate) { font-size: .88rem; }
.role-fit { padding-top: 12px; margin-top: auto; border-top: 1px dashed var(--line); color: #51494e; }
.earnings-example { margin-top: 30px; padding: clamp(20px, 3vw, 36px); background: #eae0ff; border: 1px solid var(--ink); border-radius: 8px; }
.earnings-totals strong { font: 900 clamp(2.6rem, 5vw, 4rem)/1.1 var(--display); }
.earnings-totals { gap: 24px; }
.flex-section { border-block: 1px solid var(--ink); background: #f0f5d9; }
.benefits article, .perks-grid article { background: #fffaf1; }
.perks-heading { margin-top: 38px; }
.perks-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.perks-grid h3 { margin-top: 0 !important; }
.value-stack { margin-bottom: 28px; padding: clamp(22px, 4vw, 48px); background: #fffaf1; border: 1px solid var(--ink); border-radius: 12px; }
.value-list { margin: 28px 0 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 32px; }
.value-list > div { padding: 17px 0; border-top: 1px solid var(--line); }
.value-list dt { font-weight: 800; line-height: 1.4; }
.value-list dt span { color: #5529cc; margin-right: 6px; }
.value-list dd { margin: 7px 0 0; font-size: .91rem; }
.purchase-terms { margin-top: 16px; font-weight: 700; font-size: .9rem; }
@media (max-width: 1000px) {
  .role-grid, .perks-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 670px) {
  .role-grid, .perks-grid, .value-list { grid-template-columns: 1fr; }
  .role > .label { min-height: 0; }
  .role-rate span { display: inline; margin-left: 6px; }
}

/* Day-by-day training offer */
.program-format { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px 14px; padding: 4px 0 20px; font-size: .8rem; font-weight: 700; }
.launch-days { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 16px; list-style: none; padding: 0; margin: 32px 0 20px; }
.launch-days li { border: 1px solid #817982; border-radius: 8px; padding: 24px; background: #252127; }
.launch-days li:last-child { background: var(--lime); color: var(--ink); grid-column: span 2; }
.launch-days .label { color: var(--lime); }
.launch-days li:last-child .label { color: #4921b2; }
.launch-days h3 { margin: 14px 0 9px; }
.launch-days p { font-size: .92rem; }
.plan-note { max-width: 75ch; color: #e2d9dd; font-size: .85rem; margin-bottom: 24px; }
.course-map { margin-top: 38px; border-top: 1px dashed #817982; padding-top: 26px; }
.course-map p:last-child { margin-top: 12px; max-width: 90ch; color: #e2d9dd; }
@media(max-width:1000px) { .launch-days { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media(max-width:670px) { .launch-days { grid-template-columns: 1fr; } .launch-days li:last-child { grid-column: auto; } }

.legal-links { display:flex; gap:16px; flex-wrap:wrap; }
.legal-links a { font-size:.75rem; font-weight:400; color:#51494e; text-underline-offset:3px; }
.legal-links a:hover { color:var(--purple); text-decoration:underline; }
.legal-page { max-width:850px; padding-block:56px 72px; }
.legal-page h1 { font-size:clamp(2.6rem,6vw,4.5rem); }
.legal-date { color:#51494e; font-size:.85rem; margin-bottom:36px; }
.legal-page section { margin-top:28px; }
.legal-page h2 { font-family:var(--body); font-size:1.2rem; line-height:1.4; letter-spacing:normal; text-transform:none; font-style:normal; margin-bottom:10px; }
.legal-page p { line-height:1.75; }
.legal-page a { overflow-wrap:anywhere; }
