/* Motion and content refinements keep the established ink, orange and paper identity. */
::selection { background: #ffb59d; color: var(--ink); }
.site-shell { scrollbar-color: #a29f95 var(--paper); }
[hidden], .publishing-calendar[hidden] { display: none !important; }
.header .nav-call { display: inline-flex; align-items: center; }
.hero { grid-template-rows: 78px auto; }
.tiktok-showcase { position: relative; display:grid; grid-template-columns:168px minmax(0,1fr); gap:0 18px; align-items:center; padding:8px 24px 12px; text-align:left; }
.example-caption { min-width:0; }
.example-tabs { grid-column:1/-1; display: flex; justify-content: center; gap: 6px; margin-bottom: 10px; }
.example-tabs button { min-height: 44px; padding: 9px 12px; background: transparent; border-radius: 9px; font-size: var(--type-label); font-weight: 600; }
.example-tabs button[aria-pressed="true"] { background: var(--ink); color: white; }
.tiktok-player { position:relative; width:168px; height:299px; background: var(--ink); margin: 0 auto; border-radius: 14px; overflow: hidden; box-shadow: 0 12px 24px -14px #662711aa; }
.tiktok-player iframe, .tiktok-player video { display: block; width: 100%; height: 100%; border: 0; object-fit: contain; background: var(--ink); }
.player-fallback { position:absolute; inset:0; display:flex; flex-direction:column; justify-content:center; gap:20px; padding:20px; background:var(--ink); color:white; text-align:center; font-size:13px; }
.player-fallback > span { font-size:20px; font-weight:800; }
.player-fallback a { text-decoration:underline; text-underline-offset:4px; min-height:44px; }
.example-proof { font-size: var(--type-label); font-weight: 800; margin-top: 0; }
.example-source, .example-original { font-size: 11px; line-height: 1.6; }
.example-source a, .example-original { text-decoration: underline; text-underline-offset: 3px; }
.example-original { display: inline-flex; min-height: 32px; align-items: center; }
.publishing-tag { text-align:left; display: flex; align-items: center; justify-content: center; gap: 8px; width: fit-content; margin: 12px 0 0; padding: 9px 12px; background: var(--ink); color: white; font-size: var(--type-meta); border-radius: 7px; }
.live-dot { flex-shrink:0; width: 6px; height: 6px; background: var(--orange); border-radius: 50%; }
.member-copy { padding-top: 16px; }
.how-it-works h2 { font-size: var(--type-title); }
.how-steps { position: relative; gap: 36px; }
.how-steps li { position: relative; display: grid; grid-template-columns: 32px 1fr; gap: 12px; align-items: start; }
.process-art { grid-column: 1 / -1; display: block; position: relative; z-index: 1; width: 200px; height: 200px; justify-self: center; background-image: url('assets/process.webp'); background-size: 300% 100%; background-repeat: no-repeat; mix-blend-mode: multiply; transform-origin: center 80%; }
.process-subscribe { background-position: left center; }
.process-brief { background-position: center; }
.process-publish { background-position: right center; }
.how-steps li:hover .process-art { transform: translateY(-4px) rotate(-2deg); }
.process-art { transition: transform .3s var(--easing); }
.plan-card { transition: border-color .2s, background .25s, color .25s; }
.plan-card:has(.plan:hover) { border-color: var(--orange); }
.plan-radio { transition: transform .2s; }
.plan:hover .plan-radio { transform: scale(1.2); }
.plan-blurb { display: block; font-size: var(--type-meta); color: var(--muted); margin-top: 14px; }
.plan.active .plan-blurb { color: #c9cac3; }
.plan-inclusions { padding: 22px 0 18px; }
.plan-inclusions h3 { font-size: var(--type-lead); margin-bottom: 16px; }
.plan-inclusions ul { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 24px; padding: 0; margin: 0; list-style: none; }
.plan-inclusions li { display: flex; gap: 12px; align-items: flex-start; }
.plan-inclusions svg { width: 28px; height: 28px; flex-shrink: 0; color: #ad3819; }
.plan-inclusions strong, .plan-inclusions small { display: block; }
.plan-inclusions strong { font-size: var(--type-label); font-weight: 600; }
.plan-inclusions small { font-size: var(--type-meta); color: var(--muted); margin-top: 4px; }
.route-steps strong { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; }
.step-time { flex-shrink: 0; font-size: 11px; font-weight: 600; color: #6a6253; font-variant-numeric: tabular-nums; white-space: nowrap; }
.route-assisted .step-time { color: #ff9a78; }
.route:hover .step-time { color: #a83111; }
.route-assisted:hover .step-time { color: #ffb497; }
.route-steps li { padding-left: 25px; }
.route-cash { margin-top: 18px; }
.route-cash > span { display: block; font-size: var(--type-meta); color: var(--muted); }
.route-cash > strong { display: block; font-size: var(--type-title); font-weight: 800; line-height: 1.2; margin-top: 4px; font-variant-numeric: tabular-nums; }
.route-cash > small { display: block; font-size: var(--type-meta); color: var(--muted); line-height: 1.5; min-height: 36px; margin-top: 7px; }
.time-worth { border-top: 1px solid var(--line); padding-top: 14px; margin-top: 12px; font-size: var(--type-label); line-height: 1.5; }
.time-worth > span { display: block; margin-top: 5px; font-size: 11px; color: var(--muted); }
.route-assisted .time-worth { border-color: #4c4d46; }
.route-assisted .route-cash > span, .route-assisted .route-cash > small, .route-assisted .time-worth > span { color: #c9cac3; }
.timeline-start { color: var(--muted); font-size: var(--type-label); margin-top: 8px; }
.timeline-start time { color: var(--ink); font-weight: 600; }
.time-ruler > span { display: flex; flex-direction: column; gap: 3px; }
.time-ruler > span:last-child { display:flex; text-align:right; }
.time-ruler b { font-weight: 400; color: var(--muted); }
.time-ruler time { color: var(--ink); font-weight: 600; }
.faq-call { flex-wrap: wrap; }
.faq-call [data-call] { display: inline-flex; align-items: center; justify-content: space-between; gap: 20px; flex-shrink: 0; padding: 14px 20px; min-height: 50px; background: var(--ink); color: white; font-size: var(--type-label); font-weight: 600; border-radius: 12px; transition: background .2s; }
.faq-call [data-call]:hover { background: #34362e; }
.call-duration { letter-spacing: -.04em; }
.booking-note { flex-basis: 100%; font-size: var(--type-meta); color: var(--muted); margin-top: -10px; }
.faq-list summary:after { transition: transform .2s; }
.faq-list details[open] summary:after { transform: rotate(180deg); }
.sticky-cta { padding-top: 14px; padding-bottom: calc(14px + env(safe-area-inset-bottom)); }
.cta-dock #subscribe { box-shadow: 0 6px 12px -8px #0008; min-height: 52px; animation: cta-invite 7s 2s infinite; transform-origin: center; }
.cta-dock #subscribe:hover, .cta-dock #subscribe:focus-visible { animation: none; transform: translateY(-2px); }
.cta-dock #subscribe:active { transform: translateY(1px) scale(.98); }
.cta-action { padding-right:36px; }
.cta-cue-arrow { width:86px; height:38px; right:calc(100% + 12px); top:calc(50% - 19px); }
.cta-click-rays { width:26px; height:36px; right:0; top:calc(50% - 18px); transform-origin:left center; }
.cta-cue-label { right:calc(100% + 110px); top:50%; transform:translateY(-50%); }
@keyframes cta-invite { 0%, 73%, 100% { transform: translateY(0) rotate(0); } 80% { transform: translateY(-3px) rotate(-.8deg); } 87% { transform: translateY(0) rotate(.4deg); } 94% { transform: translateY(-1px) rotate(0); } }
.paused .cta-dock #subscribe, .page-hidden .cta-dock #subscribe { animation-play-state: paused; }
@media (max-width:1100px) { .cta-cue-label { display:none; } .tiktok-showcase { padding-left: 14px; padding-right: 14px; } }
@media (max-width:900px) {
 .route-cash { display:none; }
 .route-summary-metrics { grid-template-columns: .85fr 1.15fr; }
 .route-summary-metrics span { min-height: 36px; }
 .time-worth { margin-top: 0; border: 0; padding-top: 10px; }
 .route-budget { padding-top: 0; }
 .call-copy { min-width: 0; }
}
@media (max-width:760px) {
 .header .nav-call { display:none; }
 .hero { grid-template-rows:auto; }
 .tiktok-showcase { order:2; margin-bottom:18px; padding:0 20px 0; grid-template-columns:150px minmax(0,1fr); gap:0 12px; }
 .tiktok-player { width:150px; height:267px; }
 .member-copy { padding-top:16px; }
 .how-it-works h2 { font-size: var(--type-subheading); }
 .how-steps { gap:18px; }
 .how-steps li { grid-template-columns: 84px 24px 1fr; gap:10px; align-items:center; }
 .process-art { width:84px; height:84px; grid-column:1; }
 .how-number { width:24px; height:24px; border-radius:7px; font-size:var(--type-meta); }
 .how-steps h3 { font-size:var(--type-body); }
 .how-steps p { font-size:var(--type-label); }
 .plan-inclusions ul { grid-template-columns:1fr; gap:16px; }
 .plan-blurb { grid-column:1/-1; margin-top:4px; }
 .faq-call { display:grid; grid-template-columns:minmax(0,1fr) auto; }
 .call-copy { grid-column:1; grid-row:1; }
 .call-duration { grid-column:2; grid-row:1; }
 .faq-call [data-call] { grid-column:1/-1; grid-row:2; }
 .booking-note { grid-column:1/-1; margin:0; }
 .cta-action { padding-right:26px; }
 .cta-cue-arrow { display:none; }
 .cta-click-rays { width:18px; height:30px; top:calc(50% - 15px); right:0; }
 .sticky-cta { padding-top:12px; padding-bottom:calc(12px + env(safe-area-inset-bottom)); }
 .time-ruler { font-size:11px; }
}
@media (max-width:360px) { .tiktok-showcase { grid-template-columns:130px minmax(0,1fr); padding:0 12px; gap:0 10px; } .tiktok-player { width:130px;height:231px; } .publishing-tag { padding:8px; } .how-steps li { grid-template-columns:64px 20px 1fr; gap:8px; } .process-art { width:64px;height:64px; } .how-number { width:20px;height:20px; } .call-duration { font-size:2.5rem; } }
@media (prefers-reduced-motion:reduce) { html:not(.motion-enabled) .cta-dock #subscribe { animation:none; } html:not(.motion-enabled) .process-art { transition:none; } html:not(.motion-enabled) .how-steps li:hover .process-art { transform:none; } }

.paused .how-steps li:hover .process-art { transform:none; }
.page-hidden .cta-action * { animation-play-state:paused; }
