/* Angry Muppet Consulting: the three tracks.
   Part one is the chrome every track shares and tracks.js drives: each track's
   own line, the edge tabs, the map control and the map. Part two is the content
   of the websites and launch pages. Tokens come from styles.css. */

html,body{overscroll-behavior-x:none}

/* A dive ends on the destination's own first screen. The browser keeps that last
   frame up until the new page has painted, then blends the two. They match, so
   the blend is invisible; it only covers any small difference (a font arriving).
   tracks.js cancels it for anything that is not a dive, and with reduced motion. */
@view-transition{navigation:auto}
::view-transition-group(root){animation-duration:.22s}
@media(prefers-reduced-motion:reduce){@view-transition{navigation:none}}

/* a page inside a map card never scrolls on its own */
html.track-embed{overflow:hidden}

/* ─── each track's own line ──────────────────────────────────────── */
/* tracks.js reads this position (12px, 8px on a phone) so the line on the
   map lands exactly here when the map dives into a track. */
.track-spine{position:fixed;left:12px;top:64px;bottom:0;width:2px;z-index:2;pointer-events:none;background:linear-gradient(var(--amc-cyan),rgba(52,231,255,.18) 45%,transparent 92%);box-shadow:0 0 10px var(--amc-cyan-glow);opacity:.7}
@media(max-width:759px){.track-spine{left:8px}}

/* ─── edge tabs: the next track, waiting at the side of the page ─── */
.track-edge{position:fixed;top:50%;z-index:31;display:flex;align-items:center;text-decoration:none;transform:translateY(-50%)}
.track-edge span{writing-mode:vertical-rl;font:11px var(--amc-font-mono);letter-spacing:.16em;text-transform:uppercase;color:var(--amc-cyan);padding:18px 8px;background:rgba(13,13,19,.94);border:1px solid rgba(18,169,196,.75);transition:background .4s,color .4s}
.track-edge i{display:block;width:16px;height:2px;background:var(--amc-cyan);box-shadow:var(--amc-glow-xs)}
.track-edge-next{right:0}
.track-edge-next span{border-right:0;border-radius:10px 0 0 10px}
.track-edge-prev{left:0}
.track-edge-prev span{border-left:0;border-radius:0 10px 10px 0;transform:rotate(180deg)}
.track-edge:hover span,.track-edge:focus-visible span{background:#12303a;color:var(--amc-cyan-bright)}
.track-edge:focus-visible{outline:none}
.track-edge.is-nudging{animation:track-nudge 1.8s var(--amc-ease) 1}
.track-edge-prev.is-nudging{animation-name:track-nudge-prev}
@keyframes track-nudge{0%,100%{transform:translateY(-50%)}45%{transform:translateY(-50%) translateX(-12px)}}
@keyframes track-nudge-prev{0%,100%{transform:translateY(-50%)}45%{transform:translateY(-50%) translateX(12px)}}
@media(max-width:759px){.track-edge{display:none}}

/* ─── the map control: a small copy of the map, opens the big one ── */
.track-ctl{position:fixed;right:20px;bottom:20px;z-index:31;display:flex;align-items:center;gap:10px;min-height:48px;padding:6px 14px 6px 12px;border-radius:12px;border:1px solid var(--amc-line-2);background:rgba(13,13,19,.94);color:var(--amc-text-dim);font:11px var(--amc-font-mono);letter-spacing:.12em;text-transform:uppercase;cursor:pointer;transition:border-color .4s,color .4s,bottom .3s}
.track-ctl:hover,.track-ctl:focus-visible{border-color:var(--amc-cyan-deep);color:var(--amc-text);outline:none}
.track-ctl svg{width:40px;height:26px;overflow:visible;flex:none}
.track-ctl path{fill:none;stroke:var(--amc-line-strong);stroke-width:1.5;stroke-linecap:round}
.track-ctl path.on{stroke:var(--amc-cyan);filter:drop-shadow(0 0 3px var(--amc-cyan-glow))}
.track-ctl b{color:var(--amc-cyan);font-weight:500}
.track-ctl small{font-size:10px;color:var(--amc-text-mute);padding-left:10px;border-left:1px solid var(--amc-line-2)}
@media(max-width:759px){.track-ctl{right:12px;bottom:12px;padding:6px 12px 6px 10px}.track-ctl small{display:none}.track-ctl-raised .track-ctl{bottom:72px}}

/* ─── the map ────────────────────────────────────────────────────── */
.tmap{position:fixed;inset:0;z-index:1000;background:var(--amc-black);overflow:hidden;touch-action:none}
.tmap[hidden]{display:none}
.tmap-cam{position:absolute;left:0;top:0;width:100%;height:100%;transform-origin:0 0;will-change:transform}
.tmap-lines{position:absolute;left:0;top:0;overflow:visible;pointer-events:none;z-index:2}
.tmap-lines path{fill:none;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}
.tmap-base{stroke:rgba(52,231,255,.26);stroke-width:1.5}
.tmap-here{stroke:var(--amc-cyan);stroke-width:2;filter:drop-shadow(0 0 4px var(--amc-cyan-glow));transition:opacity .3s}
.tmap-fork{stroke:var(--amc-cyan-bright);stroke-width:2.5;filter:drop-shadow(0 0 6px var(--amc-cyan-glow))}
.tmap-card{position:absolute;container-type:size;display:block;border:0;outline:1px solid var(--amc-line-2);outline-offset:-1px;border-radius:10px;background:var(--amc-black);overflow:hidden;color:var(--amc-text);text-decoration:none;transition:outline-color .45s,border-radius .5s,box-shadow .45s}
.tmap-card.is-here{outline-color:rgba(52,231,255,.5)}
.tmap.is-overview .tmap-card:hover,.tmap-card:focus-visible{outline-color:var(--amc-cyan);box-shadow:0 0 28px rgba(52,231,255,.16)}
.tmap.is-overview .tmap-card:hover{transition-delay:.12s}
.tmap-card.is-diving{outline-color:transparent;border-radius:0;box-shadow:none}
.tmap.is-moving .tmap-card{pointer-events:none}
/* the card is the real page: a frame the size of the screen, scaled to the card
   (tracks.js sets its size and scale), so a dive lands on the actual first screen */
.tmap-page{position:absolute;left:0;top:0;transform-origin:0 0;pointer-events:none;background:var(--amc-black)}
.tmap-frame{display:block;width:100%;height:100%;border:0;background:var(--amc-black);pointer-events:none}
.tmap-label i{font-style:normal;color:var(--amc-cyan);margin-right:.6em}
.tmap-label{position:absolute;margin:0;transition:opacity .25s;font:11px var(--amc-font-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--amc-text-mute);text-align:center;pointer-events:none}
.tmap-label.is-here{color:var(--amc-cyan)}
.tmap:has(.is-diving) .tmap-label{opacity:0}
.tmap-hint{position:absolute;left:0;right:0;bottom:26px;margin:0;text-align:center;font:11px var(--amc-font-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--amc-text-mute);opacity:0;transition:opacity .3s;pointer-events:none}
.tmap-close{position:absolute;top:14px;right:14px;width:44px;height:44px;border-radius:50%;border:1px solid var(--amc-line-2);background:var(--amc-deep);color:var(--amc-text-dim);font:22px/1 var(--amc-font-sans);cursor:pointer;opacity:0;pointer-events:none;transition:opacity .3s,border-color .3s}
.tmap-close:hover,.tmap-close:focus-visible{border-color:var(--amc-cyan);color:var(--amc-text);outline:none}
.tmap.is-overview .tmap-hint,.tmap.is-overview .tmap-close{opacity:1;pointer-events:auto}
@media(hover:none){.tmap-esc{display:none}}
@media(max-width:759px){
 .tmap-label{font-size:10px;letter-spacing:.08em}
}
}

/* ─── draft review: ?draft marks every line changed from the mock ── */
.show-draft [data-draft]{outline:1px dashed var(--amc-amber);outline-offset:5px}
.draft-banner{position:fixed;left:50%;top:72px;transform:translateX(-50%);z-index:40;margin:0;padding:7px 14px;border-radius:8px;background:#2a2010;border:1px solid rgba(255,194,75,.5);color:var(--amc-amber);font:11px var(--amc-font-mono);letter-spacing:.08em;white-space:nowrap}

/* ─── part two: the websites and launch pages ───────────────────── */
.tp-nav{position:fixed;top:0;left:0;right:0;z-index:20;height:64px;background:rgba(10,10,15,.82);backdrop-filter:blur(14px);border-bottom:1px solid var(--amc-line)}
.tp-nav>div{height:64px;padding:0 28px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.tp-logo{display:flex;align-items:center;gap:12px;text-decoration:none;color:inherit}
.tp-logo img{filter:drop-shadow(0 0 12px rgba(52,231,255,.4))}
.tp-word{display:flex;flex-direction:column;line-height:1}
.tp-word b{font-weight:700;font-size:17px;letter-spacing:-.03em}
.tp-word small{font-family:var(--amc-font-mono);font-size:7px;letter-spacing:.42em;text-transform:uppercase;color:var(--amc-cyan);margin-top:4px;padding-left:.42em}
.tp-links{display:flex;gap:24px;font-size:14px}
.tp-links a{color:var(--amc-text-dim);text-decoration:none;transition:color .18s}
.tp-links a:hover{color:var(--amc-text)}
.tp-cta{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:40px;padding:0 20px;border-radius:8px;background:var(--amc-cyan);color:var(--amc-cyan-ink);font-weight:600;font-size:14px;line-height:1;text-decoration:none;border:1px solid var(--amc-cyan);white-space:nowrap;transition:background .15s,box-shadow .15s}
.tp-cta:hover{color:var(--amc-cyan-ink);background:var(--amc-cyan-bright);box-shadow:var(--amc-glow-sm)}
.tp-cta.ghost{background:transparent;color:var(--amc-cyan)}
.tp-cta.ghost:hover{background:var(--amc-cyan-wash);color:var(--amc-cyan-bright)}
@media(max-width:899px){.tp-links{display:none}}
@media(max-width:759px){.tp-nav>div{padding:0 20px;gap:12px}.tp-nav .tp-cta{padding:0 16px;min-height:44px}}

.tp-page{position:relative;z-index:1;background:radial-gradient(900px 600px at 78% 30%,rgba(52,231,255,.07),transparent 60%)}
.tp-hero{min-height:100vh;min-height:100svh;box-sizing:border-box;max-width:1240px;margin:0 auto;padding:96px 32px 72px;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:48px;align-items:center}
.tp-hero-copy{margin-left:clamp(24px,3vw,48px);display:flex;flex-direction:column;gap:22px;max-width:560px}
.tp-eyebrow{font:11px var(--amc-font-mono);letter-spacing:.16em;text-transform:uppercase;color:var(--amc-cyan)}
.tp-hero h1{font-size:clamp(44px,4.7vw,66px);line-height:1.06;letter-spacing:-.045em;font-weight:500;margin:0;text-wrap:balance}
.tp-hero h1 span{text-shadow:0 0 8px rgba(52,231,255,.65),0 0 24px rgba(52,231,255,.55),0 0 52px rgba(52,231,255,.32)}
.tp-lede{font-size:clamp(18px,1.7vw,23px);line-height:1.5;margin:0;text-wrap:pretty}
.tp-sub{font-size:15px;line-height:1.6;color:var(--amc-text-dim);margin:0;max-width:38em}
.tp-hero .v2-action{align-self:flex-start;margin-top:4px}

.tp-sec{position:relative;padding:110px 32px;border-top:1px solid var(--amc-line);scroll-margin-top:64px}
.tp-sec-in{max-width:1100px;margin:0 auto;display:flex;flex-wrap:wrap;gap:40px 56px;align-items:flex-start}
.tp-side{flex:0 0 150px;position:sticky;top:96px;display:flex;flex-direction:column;gap:12px}
.tp-side i{display:block;width:26px;height:1px;background:var(--amc-cyan)}
.tp-main{flex:1 1 560px;min-width:0;display:flex;flex-direction:column;gap:18px}
.tp-sec h2{font-size:clamp(32px,4vw,50px);line-height:1.04;letter-spacing:-.03em;font-weight:700;margin:0;text-wrap:balance}
.tp-p{margin:0;max-width:42em;color:var(--amc-text-dim);font-size:17px;line-height:1.65;text-wrap:pretty}

.tp-offers{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));gap:16px;margin-top:10px}
@media(min-width:1000px){.tp-offers.is-three{grid-template-columns:repeat(3,minmax(0,1fr))}.tp-offers.is-three .tp-offer{padding:26px}}
.tp-offer{background:var(--amc-surface);border:1px solid var(--amc-line-2);border-radius:18px;padding:30px;display:flex;flex-direction:column;gap:16px}
.tp-offer.is-lead{border-color:rgba(52,231,255,.35);box-shadow:0 0 70px rgba(52,231,255,.08),var(--amc-shadow-pop)}
.tp-price{font-size:clamp(48px,5vw,68px);font-weight:700;line-height:1;letter-spacing:-.04em}
.tp-price small{font-size:15px;font-weight:400;letter-spacing:0;color:var(--amc-text-dim);margin-left:8px}
.tp-list{list-style:none;margin:0;padding:0}
.tp-list li{padding:13px 0;border-bottom:1px solid var(--amc-line);color:var(--amc-text-dim);font-size:15.5px;line-height:1.55}
.tp-list li:last-child{border-bottom:0}
.tp-list strong{color:var(--amc-text);font-weight:600}
.tp-addons{border-top:1px solid var(--amc-line-2);padding-top:14px;display:flex;flex-direction:column;gap:2px}
.tp-addons .tp-list li{font-size:14.5px;padding:10px 0}
.tp-mono{font:11px var(--amc-font-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--amc-text-mute)}
.tp-offer .tp-cta{align-self:flex-start;height:48px;padding:0 24px;font-size:15px;margin-top:auto}

.tp-steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px 28px;margin-top:8px}
.tp-step{border-top:2px solid var(--amc-cyan-deep);padding-top:14px;color:var(--amc-text-dim);font-size:15px;line-height:1.55}
.tp-step b{display:block;color:var(--amc-text);font-weight:600;font-size:17px;margin:6px 0 4px}
.tp-step span{font:11px var(--amc-font-mono);color:var(--amc-cyan)}
@media(max-width:899px){.tp-steps{grid-template-columns:1fr 1fr}}

/* the AI answer, as a customer sees it */
.tp-ai{justify-self:end;width:100%;max-width:460px;background:var(--amc-surface);border:1px solid var(--amc-line-2);border-radius:18px;padding:22px;box-shadow:var(--amc-shadow-pop)}
.tp-who{display:flex;justify-content:space-between;gap:12px;font:10px var(--amc-font-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--amc-text-mute);margin-bottom:12px}
.tp-q{font-size:15px;background:var(--amc-surface-2);border-radius:14px 14px 4px 14px;padding:11px 14px;margin-left:auto;max-width:85%;width:fit-content}
.tp-a{margin-top:14px;font-size:14.5px;color:var(--amc-text-dim);line-height:1.55}
.tp-a ol{margin:8px 0 0;padding-left:20px}
.tp-a li{margin:5px 0}
.tp-a li b{color:var(--amc-text);font-weight:500}
.tp-verdict{display:flex;gap:8px;flex-wrap:wrap;margin-top:16px;padding-top:14px;border-top:1px dashed var(--amc-line-2)}
.tp-tag{font:11px var(--amc-font-mono);padding:5px 10px;border-radius:6px}
.tp-tag.bad{background:rgba(255,61,154,.12);color:var(--amc-magenta)}
.tp-tag.warn{background:rgba(255,194,75,.12);color:var(--amc-amber)}
.tp-tag.good{background:rgba(199,251,80,.12);color:var(--amc-lime)}

/* websites hero: a dated site rebuilds itself and the facts AI tools read get
   corrected. Every rule below the animations is the finished frame, which is
   what reduced motion, ?motion=off and no script all show. With motion the
   script adds .is-motion (each piece holds its first keyframe) and then .is-play
   once; nothing repeats. The old and new sites share one grid cell, so the card
   never changes size. */
.tp-fix .tp-who{font-size:11px;color:var(--amc-text-dim)}
.tp-fix .tp-who>:first-child{color:var(--amc-cyan)}
.tp-fix-screen{border:1px solid var(--amc-line-2);border-radius:12px;overflow:hidden;background:var(--amc-deep)}
.tp-fix-bar{display:flex;gap:5px;padding:8px 10px;background:var(--amc-surface-2);border-bottom:1px solid var(--amc-line)}
.tp-fix-bar i{width:7px;height:7px;border-radius:50%;background:var(--amc-line-2)}
.tp-fix-stage{display:grid}
.tp-fix-old,.tp-fix-new{grid-area:1/1;display:flex;flex-direction:column;padding:16px 18px;min-width:0}
.tp-fix-old{opacity:0;align-items:center;text-align:center;gap:6px;background:var(--amc-surface-3);color:var(--amc-text-dim);font-size:12px;line-height:1.35}
.tp-fix-old b{font-size:15px;font-weight:700;color:var(--amc-text);text-decoration:underline}
.tp-fix-img{width:70%;padding:12px 0;border:1px dashed var(--amc-line-strong);font:11px var(--amc-font-mono);color:var(--amc-text-mute)}
.tp-fix-old .o3{color:var(--amc-amber)}
.tp-fix-old u{color:var(--amc-magenta)}
.tp-fix-old small{font:11px var(--amc-font-mono);color:var(--amc-text-dim)}
.tp-fix-new{gap:8px;justify-content:center}
.tp-fix-head{display:flex;align-items:baseline;gap:12px;padding-bottom:10px;margin-bottom:4px;border-bottom:2px solid var(--amc-lime)}
.tp-fix-head b{font-size:15px;font-weight:700;color:var(--amc-lime);margin-right:auto;letter-spacing:-.01em}
.tp-fix-head span{font:11px var(--amc-font-mono);color:var(--amc-text-mute)}
.tp-fix-new strong{font-size:22px;line-height:1.15;font-weight:600;letter-spacing:-.025em;color:var(--amc-text)}
.tp-fix-new .n3{font-size:13px;color:var(--amc-text-dim)}
.tp-fix-row{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;margin-top:4px}
.tp-fix-row em{font-style:normal;font-weight:600;font-size:13px;background:var(--amc-lime);color:var(--amc-lime-ink);border-radius:6px;padding:7px 12px}
.tp-fix-row span{font-size:13px;font-weight:500;color:var(--amc-text)}
.tp-fix-facts{margin-top:16px;padding-top:14px;border-top:1px dashed var(--amc-line-2)}
.tp-fix-label{display:block;font:11px var(--amc-font-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--amc-text-dim);margin-bottom:4px}
.tp-fix-fact{display:flex;align-items:center;gap:12px;padding:8px 0;font-size:14.5px;color:var(--amc-text)}
.tp-fix-swap{display:grid}
.tp-fix-swap>*{grid-area:1/1}
.tp-fix-swap .tp-tag{min-width:62px;text-align:center}
.tp-fix-swap>:first-child{opacity:0}
.tp-fix-txt{min-width:0}
.tp-fix-txt>:first-child{position:relative;color:var(--amc-text-dim);justify-self:start}
.tp-fix-txt>:first-child::after{content:"";position:absolute;left:0;right:0;top:52%;height:1.5px;background:currentColor;transform-origin:left}
.tp-fix-note{margin:12px 0 0;font-size:14px;line-height:1.5;color:var(--amc-text)}

/* the timeline, in seconds from the start: the old site leaves 1.4 to 2.05 while
   the new one arrives from 1.55, so the screen is never empty; then one fact is
   corrected about every 1.4s, Saturday hours first; the closing line at 7.9. */
@keyframes tp-fix-out{from{opacity:1;transform:none}to{opacity:0;transform:translateY(-6px)}}
@keyframes tp-fix-gone{from{opacity:1}to{opacity:0}}
@keyframes tp-fix-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
@keyframes tp-fix-wipe{from{opacity:0;clip-path:inset(0 100% 0 0)}to{opacity:1;clip-path:inset(0 0 0 0)}}
@keyframes tp-fix-strike{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.tp-fix.is-motion *,.tp-fix.is-motion *::after{animation-fill-mode:both;animation-timing-function:cubic-bezier(.65,0,.35,1);animation-play-state:paused;animation-delay:var(--d,0s)}
.tp-fix.is-play *,.tp-fix.is-play *::after{animation-play-state:running}
.tp-fix.is-motion .tp-fix-old>*{animation-name:tp-fix-out;animation-duration:.35s}
.tp-fix .o1{--d:1.4s}.tp-fix .o2{--d:1.45s}.tp-fix .o3{--d:1.5s}.tp-fix .o4{--d:1.55s}.tp-fix .o5{--d:1.6s}.tp-fix .o6{--d:1.65s}
.tp-fix.is-motion .tp-fix-old{animation-name:tp-fix-gone;animation-duration:.45s;--d:1.6s}
.tp-fix.is-motion .tp-fix-new>*{animation-name:tp-fix-in;animation-duration:.55s}
.tp-fix.is-motion .n1{animation-name:tp-fix-wipe;animation-duration:.7s;--d:1.55s}
.tp-fix .n2{--d:1.9s}.tp-fix .n3{--d:2.1s}.tp-fix .n4{--d:2.3s}
.tp-fix.is-motion .tp-fix-txt>:first-child::after{animation-name:tp-fix-strike;animation-duration:.45s}
.tp-fix.is-motion .tp-fix-swap>:first-child{animation-name:tp-fix-gone;animation-duration:.35s}
.tp-fix.is-motion .tp-fix-swap>:last-child{animation-name:tp-fix-in;animation-duration:.45s}
.tp-fix .f1 .tp-fix-txt>:first-child::after{--d:3.2s}.tp-fix .f1 .tp-fix-swap>:first-child{--d:3.7s}.tp-fix .f1 .tp-fix-swap>:last-child{--d:3.85s}
.tp-fix .f2 .tp-fix-txt>:first-child::after{--d:5.2s}.tp-fix .f2 .tp-fix-swap>:first-child{--d:5.7s}.tp-fix .f2 .tp-fix-swap>:last-child{--d:5.85s}
.tp-fix .f3 .tp-fix-txt>:first-child::after{--d:6.6s}.tp-fix .f3 .tp-fix-swap>:first-child{--d:7.1s}.tp-fix .f3 .tp-fix-swap>:last-child{--d:7.25s}
.tp-fix.is-motion .tp-fix-note{animation-name:tp-fix-in;animation-duration:.6s;--d:7.9s}
@media(prefers-reduced-motion:reduce){.tp-fix *,.tp-fix *::after{animation:none!important}}

/* launch: the first month, and the waitlist */
.tp-month{justify-self:end;width:100%;max-width:440px;background:var(--amc-surface);border:1px solid var(--amc-line-2);border-radius:18px;padding:22px 24px;box-shadow:var(--amc-shadow-pop)}
.tp-row{display:flex;gap:12px;align-items:center;padding:11px 0;border-bottom:1px solid var(--amc-line);font-size:15px}
.tp-row:last-child{border-bottom:0}
.tp-box{width:20px;height:20px;border-radius:5px;border:1.5px solid var(--amc-line-strong);flex:0 0 20px;display:grid;place-items:center;font-size:12px}
.tp-row.done .tp-box{background:var(--amc-lime);border-color:var(--amc-lime);color:var(--amc-lime-ink)}
.tp-row.done>span:nth-child(2){color:var(--amc-text-dim)}
.tp-wk{margin-left:auto;font:11px var(--amc-font-mono);color:var(--amc-text-mute)}
.tp-join{display:flex;flex-direction:column;gap:10px;max-width:480px}
.tp-join-row{display:flex;gap:10px;flex-wrap:wrap}
.tp-join-row .lead-input{flex:1 1 220px;width:auto}
.tp-join button,.tp-note button{display:inline-flex;align-items:center;justify-content:center;height:48px;padding:0 24px;border-radius:8px;background:var(--amc-cyan);color:var(--amc-cyan-ink);font-family:inherit;font-weight:600;font-size:15px;border:1px solid var(--amc-cyan);cursor:pointer;transition:background .15s,box-shadow .15s}
.tp-join button:hover:not(:disabled),.tp-note button:hover:not(:disabled){background:var(--amc-cyan-bright);box-shadow:var(--amc-glow-sm)}
.tp-join button:disabled,.tp-note button:disabled{opacity:.6;cursor:progress}
.tp-fine{font-size:13px;color:var(--amc-text-mute);margin:0}

/* the closing note form on websites */
.tp-note{width:100%;max-width:560px;display:flex;flex-direction:column;gap:14px;margin-top:10px}
.tp-note label{display:flex;flex-direction:column;gap:6px;flex:0 0 auto}
.tp-note-row label{flex:1 1 200px}
.tp-note label>span{font-size:13px;color:var(--amc-text-dim)}
.tp-note-row{display:flex;gap:14px;flex-wrap:wrap}
.tp-note button{align-self:flex-start}
.tp-hp{position:absolute;left:-9999px}

/* websites: one section per level, benefits beside an example */
.tp-lvl .tp-mono{color:var(--amc-cyan)}
.tp-split{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:28px 40px;align-items:start;margin-top:10px}
.tp-bens{list-style:none;margin:0;padding:0;counter-reset:ben}
.tp-bens li{counter-increment:ben;position:relative;padding:16px 0 16px 44px;border-bottom:1px solid var(--amc-line);color:var(--amc-text-dim);font-size:15.5px;line-height:1.6}
.tp-bens li:last-child{border-bottom:0}
.tp-bens li::before{content:"0" counter(ben);position:absolute;left:0;top:19px;font:11px var(--amc-font-mono);color:var(--amc-cyan)}
.tp-bens b{display:block;color:var(--amc-text);font-weight:600;font-size:18px;margin-bottom:4px}
.tp-vis{justify-self:stretch;max-width:none}
.tp-box-vis{background:var(--amc-surface);border:1px solid var(--amc-line-2);border-radius:18px;padding:22px;box-shadow:var(--amc-shadow-pop)}
.tp-inq{display:flex;align-items:center;gap:12px;padding:11px 0;border-bottom:1px solid var(--amc-line);font-size:14.5px;color:var(--amc-text-dim)}
.tp-inq:last-child{border-bottom:0}
.tp-inq b{color:var(--amc-text);font-weight:600}
.tp-inq .tp-tag{flex:0 0 auto;min-width:74px;text-align:center}
.tp-inq .tp-tag:not(.good):not(.warn):not(.bad){background:var(--amc-surface-2);color:var(--amc-text-mute)}
.tp-inq small{margin-left:auto;font:10px var(--amc-font-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--amc-text-mute);white-space:nowrap}
.tp-inq.is-done{opacity:.6}
.tp-box-vis .tp-q{margin-top:12px}
.tp-who+.tp-q{margin-top:0}
.tp-bot{font-size:14.5px;line-height:1.55;color:var(--amc-text);background:rgba(52,231,255,.08);border:1px solid rgba(52,231,255,.22);border-radius:14px 14px 14px 4px;padding:11px 14px;margin-top:12px;max-width:88%;width:fit-content}
.tp-lvl-cta{align-self:flex-start;height:48px;padding:0 24px;font-size:15px;margin-top:6px}
.tp-pick{border:0;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.tp-pick legend{font-size:13px;color:var(--amc-text-dim);margin-bottom:8px;padding:0}
.tp-pick label{flex:0 0 auto;cursor:pointer}
.tp-pick input{position:absolute;opacity:0;pointer-events:none}
.tp-pick span{display:inline-flex;align-items:center;gap:6px;min-height:40px;padding:0 14px;border-radius:999px;border:1px solid var(--amc-line-2);color:var(--amc-text-dim);font-size:14px;transition:border-color .2s,color .2s,background .2s}
.tp-pick small{color:var(--amc-text-mute);font-size:12px}
.tp-pick input:checked+span{border-color:var(--amc-cyan);color:var(--amc-text);background:var(--amc-cyan-wash)}
.tp-pick input:focus-visible+span{outline:2px solid var(--amc-cyan);outline-offset:2px}
@media(max-width:899px){.tp-split{grid-template-columns:minmax(0,1fr)}}

.tp-foot{border-top:1px solid var(--amc-line);padding:44px 32px 96px;background:var(--amc-black);position:relative;z-index:1}
.tp-foot>div{max-width:1100px;margin:0 auto;display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:20px 40px}
.tp-foot nav{display:flex;gap:26px;font-size:14px;flex-wrap:wrap}
.tp-foot nav a{color:var(--amc-text-dim);text-decoration:none}
.tp-foot nav a:hover{color:var(--amc-text)}
.tp-foot>div>span{font-family:var(--amc-font-mono);font-size:11px;letter-spacing:.06em;color:var(--amc-text-mute)}

@media(max-width:899px){.tp-hero{grid-template-columns:1fr;gap:40px;align-items:start;padding-top:120px}.tp-ai,.tp-month{justify-self:start}}
@media(max-width:759px){
 .tp-hero{padding:104px 24px 64px;min-height:0}
 .tp-hero-copy{margin-left:0;gap:18px}
 .tp-hero h1{font-size:40px;line-height:1.04}
 .tp-lede{font-size:18px}
 .tp-sec{padding:64px 24px}
 .tp-sec-in{gap:24px}
 .tp-side{position:static}
 .tp-offer{padding:24px}
 .tp-foot{padding:40px 24px 96px}
}
@media(max-width:540px){.tp-steps{grid-template-columns:1fr}}

/* First screen of a track: the price line and its two actions. Numbered package rows on launch. */
.tp-hero-price{margin:0;font-size:17px;line-height:1.5;color:var(--amc-text-dim)}
.tp-hero-price strong{color:var(--amc-cyan);font-weight:700;font-size:22px;letter-spacing:-.01em}
.tp-hero-acts{display:flex;flex-wrap:wrap;align-items:center;gap:14px 22px}
.tp-hero-acts .v2-action{margin-top:0}
.tp-text-link{color:var(--amc-cyan);font-size:15px;text-underline-offset:3px}
.tp-num{font:11px var(--amc-font-mono);color:var(--amc-cyan);flex:0 0 22px}
.tp-inq>span:nth-child(2){min-width:0}
@media(max-width:759px){.tp-inq small{white-space:normal;text-align:right;max-width:40%}}
