/* ==========================================================================
   Trainow — main stylesheet
   Tokens come from theme.json (--wp--preset--*). Short aliases below.
   ========================================================================== */

:root {
	--tn-black: var(--wp--preset--color--contrast, #000);
	--tn-white: var(--wp--preset--color--base, #fff);
	--tn-mist: var(--wp--preset--color--base-2, #f4f7f8);
	--tn-ink: var(--wp--preset--color--ink, #0b1114);
	--tn-deep: var(--wp--preset--color--deep, #001e26);
	--tn-cyan: var(--wp--preset--color--accent, #01b1e0);
	--tn-ice: var(--wp--preset--color--accent-2, #5bd0f0);
	--tn-muted: var(--wp--preset--color--muted, #66737a);
	--tn-line: var(--wp--preset--color--line, #e3e8ea);
	--tn-head: var(--wp--preset--font-family--heading, sans-serif);
	--tn-body: var(--wp--preset--font-family--body, sans-serif);
	--tn-ease: cubic-bezier(.2, .7, .1, 1);
	--tn-radius: 28px;
	--tn-gutter: clamp(1rem, 4vw, 2.5rem);
	--tn-section: clamp(5rem, 12vw, 10rem);
	--tn-header-h: 68px;
}

html { scroll-behavior: smooth; scroll-padding-top: calc(var(--tn-header-h) + 16px); }
body { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeLegibility; overflow-x: clip; }
::selection { background: var(--tn-ice); color: var(--tn-black); }
:focus-visible { outline: 2px solid var(--tn-cyan); outline-offset: 3px; border-radius: 4px; }
img { height: auto; max-width: 100%; }
.tn-main { margin-block-start: 0 !important; }
.wp-site-blocks > * + * { margin-block-start: 0; }

.tn-icon { width: 1.25em; height: 1.25em; flex: none; vertical-align: middle; }

.tn-eyebrow, .is-style-eyebrow {
	font-family: var(--tn-body) !important;
	font-size: .78rem !important;
	font-weight: 500 !important;
	letter-spacing: .14em !important;
	text-transform: uppercase;
	color: var(--tn-muted);
	line-height: 1.4 !important;
	margin-block-end: 1rem;
}
.is-style-dark .tn-eyebrow, .is-style-dark .is-style-eyebrow { color: rgba(255, 255, 255, .55); }
.tn-lede { font-size: clamp(1.1rem, 1.6vw, 1.35rem); color: var(--tn-muted); max-width: 40ch; }

/* ---------- Buttons ---------- */
.wp-element-button, .wp-block-button__link { transition: background-color .3s var(--tn-ease), color .3s, transform .3s var(--tn-ease), box-shadow .3s; }
.wp-block-button__link:hover { transform: translateY(-2px); box-shadow: 0 10px 30px -10px rgba(1, 177, 224, .55); }
.wp-block-button.is-small .wp-block-button__link { padding: .6rem 1.15rem; font-size: .85rem; }
.wp-block-button.is-style-ghost .wp-block-button__link { background: transparent; color: inherit; box-shadow: inset 0 0 0 1px currentColor; }
.wp-block-button.is-style-ghost .wp-block-button__link:hover { background: var(--tn-cyan); color: var(--tn-black); box-shadow: inset 0 0 0 1px var(--tn-cyan); }
.is-style-dark .wp-block-button:not(.is-style-ghost) .wp-block-button__link { background: var(--tn-white); color: var(--tn-black); }
.is-style-dark .wp-block-button:not(.is-style-ghost) .wp-block-button__link:hover { background: var(--tn-cyan); }

.tn-stores { display: flex; flex-wrap: wrap; gap: .75rem; justify-content: inherit; }
.tn-store {
	display: inline-flex; align-items: center; gap: .65rem;
	padding: .6rem 1.25rem .6rem 1rem; border-radius: 14px;
	background: var(--tn-black); color: var(--tn-white) !important;
	text-decoration: none !important; line-height: 1.1; font-weight: 500; font-size: 1.05rem;
	transition: transform .3s var(--tn-ease), background .3s, box-shadow .3s;
}
.tn-store .tn-icon { width: 1.6rem; height: 1.6rem; }
.tn-store small { display: block; font-size: .66rem; font-weight: 400; opacity: .75; letter-spacing: .02em; }
.tn-store:not(.is-soon):hover { transform: translateY(-2px); box-shadow: 0 12px 30px -12px rgba(1, 177, 224, .8); }
.tn-store--light { background: var(--tn-white); color: var(--tn-black) !important; }
.tn-store.is-soon { background: transparent; color: inherit !important; box-shadow: inset 0 0 0 1px currentColor; opacity: .55; cursor: default; }
.tn-store--light.is-soon { color: var(--tn-white) !important; }

/* ---------- Header ---------- */
/* WordPress wraps the header part in a div, so that wrapper is what sticks. */
.wp-site-blocks > .wp-block-template-part:first-child { position: sticky; top: var(--wp-admin--admin-bar--height, 0px); z-index: 100; }
.tn-header {
	position: relative;
	padding-block: 0 !important;
	background: rgba(255, 255, 255, .72);
	-webkit-backdrop-filter: saturate(180%) blur(20px);
	backdrop-filter: saturate(180%) blur(20px);
	border-bottom: 1px solid transparent;
	transition: background .4s, color .4s, border-color .4s;
}
.tn-header.is-scrolled { border-bottom-color: rgba(0, 0, 0, .06); }
.tn-header.is-on-dark { background: rgba(0, 0, 0, .6); color: var(--tn-white); border-bottom-color: rgba(255, 255, 255, .08); }
.tn-header.is-on-dark .wp-block-button__link { background: var(--tn-white); color: var(--tn-black); }
.tn-header__bar { min-height: var(--tn-header-h); align-items: center; }
.tn-header__right { gap: clamp(.75rem, 2vw, 2rem) !important; }
.tn-logo { margin: 0; font-family: var(--tn-head); font-size: 1.75rem; font-weight: 400; letter-spacing: -.03em; line-height: 1; text-transform: lowercase; }
.tn-logo a { text-decoration: none; color: inherit; }
.tn-nav a { text-decoration: none; opacity: .8; transition: opacity .2s; }
.tn-nav a:hover { opacity: 1; color: inherit; }
.tn-nav .wp-block-navigation__container { gap: clamp(1rem, 2.2vw, 2rem); }
.wp-block-navigation__responsive-container.is-menu-open { background: var(--tn-black) !important; color: var(--tn-white) !important; padding: 5rem var(--tn-gutter) 2rem; }
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item a { font-family: var(--tn-head); font-size: 2.2rem; opacity: 1; }
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container { gap: 1rem; align-items: flex-start !important; }
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content { align-items: flex-start !important; padding-top: 2rem; }
/* backdrop-filter would trap the fixed full-screen menu inside the header box. */
.tn-header:has(.is-menu-open) { -webkit-backdrop-filter: none; backdrop-filter: none; }
@media (max-width: 599px) { .tn-header__cta { display: none; } }

/* ---------- Reveal on scroll ---------- */
.tn-js .tn-reveal { opacity: 0; transform: translate3d(0, 28px, 0); transition: opacity .9s var(--tn-ease), transform 1.1s var(--tn-ease); transition-delay: calc(var(--d, 0) * 90ms); }
.tn-js .tn-reveal.is-in { opacity: 1; transform: none; }

/* Grid containers built from Group blocks: drop the flow-layout gap margin. */
.tn-footer__cols > *, .tn-footer__top > *, .tn-news__card > *, .tn-why__grid > *, .tn-steps-grid > * { margin-block: 0 !important; }

/* ---------- Dark sections ---------- */
.is-style-dark { background: var(--tn-black); color: var(--tn-white); }
.is-style-dark a:not(.wp-block-button__link):not(.tn-store) { color: inherit; }

/* ==========================================================================
   Phone + coded app screens. Everything inside scales with container units.
   ========================================================================== */
.tn-phone { --pw: 300px; width: var(--pw); max-width: 100%; aspect-ratio: 9 / 19.3; position: relative; flex: none; }
.tn-phone__frame {
	container-type: inline-size;
	position: absolute; inset: 0; border-radius: calc(var(--pw) * .16);
	background: #0a0a0a; padding: calc(var(--pw) * .032);
	box-shadow: 0 0 0 1.5px #2b2f31, 0 0 0 calc(var(--pw) * .012) #111, 0 50px 100px -30px rgba(0, 30, 38, .55), 0 30px 60px -40px rgba(0, 0, 0, .6);
}
.tn-phone__island { position: absolute; z-index: 3; top: calc(var(--pw) * .055); left: 50%; width: 30%; height: calc(var(--pw) * .085); transform: translateX(-50%); background: #000; border-radius: 99px; }
.tn-phone__screen {
	position: relative; height: 100%; overflow: hidden; box-sizing: border-box;
	border-radius: calc(var(--pw) * .13);
	background: radial-gradient(130% 60% at 50% 0%, #073846 0%, var(--tn-deep) 55%, #00141a 100%);
	color: #fff; font-family: var(--tn-body); font-weight: 300;
	padding: 17cqw 6.5cqw 6cqw; display: flex; flex-direction: column; gap: 3.6cqw;
	text-align: left; line-height: 1.25;
}
.tn-phone.is-small { --pw: 230px; margin: 2rem auto 0; }
.tn-phone.is-tilt { transform: rotate(-6deg); }

.tn-scr__status { position: absolute; top: 5.5cqw; left: 10cqw; right: 9cqw; display: flex; justify-content: space-between; align-items: center; font-size: 3.9cqw; font-weight: 600; }
.tn-scr__sig { display: flex; gap: .8cqw; align-items: flex-end; }
.tn-scr__sig i { width: 1cqw; background: #fff; border-radius: 1px; }
.tn-scr__sig i:nth-child(1) { height: 1.6cqw; } .tn-scr__sig i:nth-child(2) { height: 2.4cqw; } .tn-scr__sig i:nth-child(3) { height: 3.2cqw; }
.tn-scr__sig b { width: 6cqw; height: 3cqw; border: .5cqw solid #fff; border-radius: 1cqw; margin-left: 1.2cqw; box-shadow: inset -2.2cqw 0 0 -.4cqw #fff; }
.tn-scr .tn-icon { width: 5.2cqw; height: 5.2cqw; }
.tn-scr small { font-size: 3.4cqw; }
.tn-scr em { font-style: normal; font-size: 3.1cqw; opacity: .65; display: block; }
.tn-scr b { font-weight: 500; font-size: 3.9cqw; }

.tn-scr__top { display: flex; justify-content: space-between; align-items: center; }
.tn-scr__top > .tn-icon--arrow { transform: rotate(180deg); }
.tn-scr__eyebrow { text-transform: uppercase; letter-spacing: .12em; opacity: .55; font-size: 2.9cqw !important; margin-top: 1cqw; }
.tn-scr__hello { margin: -2cqw 0 0; font-family: var(--tn-head); font-size: 12.5cqw; line-height: 1; letter-spacing: -.02em; font-weight: 500; }
.tn-scr__title { margin: 0; font-family: var(--tn-head); font-size: 8.4cqw; line-height: 1.02; font-weight: 400; }
.tn-scr__search { display: flex; gap: 2.4cqw; align-items: center; padding: 3.4cqw 4cqw; border-radius: 99px; background: rgba(255, 255, 255, .08); font-size: 3.4cqw; opacity: .9; }
.tn-scr__cats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 2.6cqw 2cqw; }
.tn-scr__cat { display: flex; flex-direction: column; align-items: center; gap: 1.4cqw; }
.tn-scr__cat .tn-icon { width: 13cqw; height: 13cqw; padding: 3.2cqw; border-radius: 4.5cqw; background: rgba(255, 255, 255, .07); color: var(--tn-ice); box-sizing: border-box; }
.tn-scr__cat:first-child .tn-icon { background: var(--tn-cyan); color: #00141a; }
.tn-scr__cat em { font-size: 2.5cqw; opacity: .8; white-space: nowrap; }
.tn-scr__session, .tn-scr__row, .tn-scr__coach, .tn-scr__opt { display: flex; gap: 3cqw; align-items: center; padding: 3.2cqw; border-radius: 5cqw; background: rgba(255, 255, 255, .06); }
.tn-scr__session > span:not(.tn-av), .tn-scr__row > span:not(.tn-av), .tn-scr__coach > span:not(.tn-av), .tn-scr__opt > span { flex: 1; min-width: 0; }
.tn-scr__session.is-next { background: linear-gradient(120deg, rgba(1, 177, 224, .35), rgba(1, 177, 224, .08)); box-shadow: inset 0 0 0 1px rgba(91, 208, 240, .35); }
.tn-scr__pill { font-style: normal; font-size: 2.6cqw; padding: 1.2cqw 2.4cqw; border-radius: 99px; background: var(--tn-cyan); color: #00141a; font-weight: 600; }
.tn-scr__pill.is-soft { background: rgba(255, 255, 255, .12); color: #fff; }
.tn-av { --h: 190; flex: none; display: inline-grid; place-items: center; width: 10cqw; height: 10cqw; border-radius: 50%; font-size: 3.2cqw; font-weight: 600; color: #fff; background: linear-gradient(140deg, hsl(var(--h) 85% 55%), hsl(calc(var(--h) + 40) 70% 32%)); }
.tn-scr__tabbar { margin-top: auto; display: flex; justify-content: space-around; padding: 3.2cqw 2cqw; border-radius: 99px; background: rgba(255, 255, 255, .08); }
.tn-scr__tabbar span { opacity: .5; } .tn-scr__tabbar .is-on { opacity: 1; color: var(--tn-ice); }

/* location */
.tn-scr__map { position: relative; height: 34cqw; border-radius: 5cqw; overflow: hidden; background: #0b3a47 repeating-linear-gradient(0deg, transparent 0 7cqw, rgba(255, 255, 255, .05) 7cqw 7.4cqw), repeating-linear-gradient(90deg, transparent 0 7cqw, rgba(255, 255, 255, .05) 7cqw 7.4cqw); }
.tn-scr__park { position: absolute; width: 40cqw; height: 22cqw; left: 40cqw; top: 5cqw; border-radius: 45% 55% 40% 60%; background: rgba(76, 200, 140, .35); }
.tn-scr__road { position: absolute; background: rgba(255, 255, 255, .18); }
.tn-scr__road.a { height: 2.4cqw; left: -5cqw; right: -5cqw; top: 24cqw; transform: rotate(-8deg); }
.tn-scr__road.b { width: 2.4cqw; top: -5cqw; bottom: -5cqw; left: 28cqw; transform: rotate(10deg); }
.tn-scr__pin { position: absolute; left: 52cqw; top: 6cqw; color: var(--tn-ice); animation: tn-bob 2.4s var(--tn-ease) infinite; }
.tn-scr__pin .tn-icon { width: 9cqw; height: 9cqw; fill: rgba(1, 177, 224, .35); }
.tn-scr__pin::after { content: ""; position: absolute; left: 50%; top: 100%; width: 8cqw; height: 2.4cqw; margin-left: -4cqw; border-radius: 50%; background: rgba(91, 208, 240, .5); animation: tn-pulse 2.4s infinite; }
.tn-scr__opts { display: grid; gap: 2.2cqw; }
.tn-scr__opt i { width: 4.6cqw; height: 4.6cqw; border-radius: 50%; box-shadow: inset 0 0 0 .5cqw rgba(255, 255, 255, .4); }
.tn-scr__opt.is-on { box-shadow: inset 0 0 0 1px var(--tn-cyan); background: rgba(1, 177, 224, .14); }
.tn-scr__opt.is-on i { box-shadow: inset 0 0 0 1.4cqw var(--tn-cyan); }
.tn-scr__opt .tn-icon { color: var(--tn-ice); }

/* booking */
.tn-scr__coach .tn-icon, .tn-scr__row em .tn-icon, .tn-scr__row b .tn-icon { width: 3cqw; height: 3cqw; color: var(--tn-ice); vertical-align: -.3cqw; }
.tn-scr__badges { display: flex; gap: 1.6cqw; flex-wrap: wrap; }
.tn-scr__badges i, .tn-scr__chips i, .tn-scr__tags i { font-style: normal; display: inline-flex; align-items: center; gap: 1cqw; font-size: 2.8cqw; padding: 1.4cqw 2.6cqw; border-radius: 99px; background: rgba(255, 255, 255, .08); }
.tn-scr__badges .tn-icon { width: 3.2cqw; height: 3.2cqw; color: var(--tn-ice); }
.tn-scr__days { display: grid; grid-template-columns: repeat(5, 1fr); gap: 1.6cqw; }
.tn-scr__day { text-align: center; padding: 2.4cqw 0; border-radius: 4cqw; background: rgba(255, 255, 255, .06); }
.tn-scr__day b { display: block; font-family: var(--tn-head); font-size: 5.4cqw; }
.tn-scr__day.is-on, .tn-scr__time.is-on, .tn-scr__chips .is-on, .tn-scr__tags .is-on { background: var(--tn-cyan); color: #00141a; }
.tn-scr__day.is-on em { opacity: .8; }
.tn-scr__times { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.8cqw; }
.tn-scr__time { text-align: center; font-size: 3.3cqw; padding: 2.4cqw 0; border-radius: 3cqw; background: rgba(255, 255, 255, .06); }
.tn-scr__time.is-off { opacity: .3; text-decoration: line-through; }
.tn-scr__cta { margin-top: auto; text-align: center; padding: 4cqw; border-radius: 99px; background: #fff; color: #00141a; font-weight: 600; font-size: 3.8cqw; }

/* arrival */
.tn-scr__eta { padding: 4cqw; border-radius: 5cqw; background: rgba(255, 255, 255, .06); display: grid; gap: 3cqw; }
.tn-scr__eta > span { display: grid; grid-template-columns: auto 1fr; column-gap: 3cqw; align-items: center; }
.tn-scr__eta > span .tn-av { grid-row: span 2; }
.tn-scr__track { height: 1.6cqw; border-radius: 99px; background: rgba(255, 255, 255, .12); overflow: hidden; }
.tn-scr__track i { display: block; height: 100%; width: 70%; border-radius: inherit; background: linear-gradient(90deg, var(--tn-cyan), var(--tn-ice)); animation: tn-eta 4s var(--tn-ease) infinite alternate; }
.tn-scr__code { display: grid; grid-template-columns: repeat(4, 1fr); gap: 2.4cqw; }
.tn-scr__code b { display: grid; place-items: center; aspect-ratio: 3 / 4; border-radius: 4cqw; background: rgba(255, 255, 255, .08); box-shadow: inset 0 0 0 1px rgba(91, 208, 240, .4); font-family: var(--tn-head); font-size: 11cqw; font-weight: 500; }
.tn-scr__note { margin: 0; font-size: 3.2cqw; opacity: .7; }

/* review */
.tn-scr__done { display: flex; flex-direction: column; gap: 3cqw; }
.tn-scr__done .tn-av { width: 16cqw; height: 16cqw; font-size: 5cqw; }
.tn-scr__stars { display: flex; gap: 2cqw; color: var(--tn-ice); }
.tn-scr__stars .tn-icon { width: 10cqw; height: 10cqw; fill: currentColor; }
.tn-scr__stars i { animation: tn-pop .6s var(--tn-ease) both; animation-delay: calc(var(--i, 0) * 120ms); }
.tn-scr__stars i:nth-child(2) { --i: 1; } .tn-scr__stars i:nth-child(3) { --i: 2; } .tn-scr__stars i:nth-child(4) { --i: 3; } .tn-scr__stars i:nth-child(5) { --i: 4; }
.tn-scr__tags, .tn-scr__chips { display: flex; flex-wrap: wrap; gap: 1.6cqw; }
.tn-scr__text { padding: 3.6cqw; border-radius: 4cqw; background: rgba(255, 255, 255, .06); font-size: 3.3cqw; opacity: .85; }
.tn-scr__rows { display: grid; gap: 2.2cqw; }

/* ---------- Floating cards ---------- */
.tn-float {
	display: flex; align-items: center; gap: .6rem;
	padding: .7rem .95rem; border-radius: 18px;
	background: rgba(255, 255, 255, .82); color: var(--tn-ink);
	-webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px);
	box-shadow: 0 1px 0 rgba(255, 255, 255, .8) inset, 0 20px 40px -18px rgba(0, 30, 38, .35), 0 0 0 1px rgba(0, 0, 0, .04);
	font-size: .8rem; line-height: 1.25; white-space: nowrap;
	container-type: normal;
}
.tn-float b { font-weight: 600; display: block; }
.tn-float em { font-style: normal; opacity: .6; display: block; font-size: .72rem; }
.tn-float .tn-av { width: 38px; height: 38px; font-size: .75rem; }
.tn-float--coach i { display: flex; color: var(--tn-cyan); margin-top: 2px; }
.tn-float--coach i .tn-icon { width: 12px; height: 12px; fill: currentColor; }
.tn-float--date { flex-direction: column; align-items: flex-start; }
.tn-float--date span { display: flex; gap: .35rem; }
.tn-float--date i { font-style: normal; display: grid; place-items: center; width: 30px; height: 34px; border-radius: 10px; background: var(--tn-mist); font-weight: 500; }
.tn-float--date i.is-on { background: var(--tn-black); color: #fff; }
.tn-float--verified .tn-icon { width: 28px; height: 28px; color: var(--tn-cyan); }
.tn-float--code { flex-direction: column; align-items: flex-start; background: var(--tn-black); color: #fff; }
.tn-float--code b { font-family: var(--tn-head); font-size: 1.6rem; letter-spacing: .2em; font-weight: 500; }
.tn-float--sport { background: var(--tn-cyan); color: var(--tn-black); font-family: var(--tn-head); font-size: 1.1rem; line-height: 1; }
.tn-float--sport .tn-icon { width: 34px; height: 34px; }
.tn-float--sport em { font-family: var(--tn-body); font-size: .7rem; opacity: .7; }
.tn-float--ring svg { width: 44px; height: 44px; transform: rotate(-90deg); }
.tn-float--ring circle { fill: none; stroke: var(--tn-line); stroke-width: 5; }
.tn-float--ring circle.p { stroke: var(--tn-cyan); stroke-linecap: round; stroke-dasharray: 113; stroke-dashoffset: 30; animation: tn-ring 3s var(--tn-ease) infinite alternate; }
.tn-float--ring b { font-family: var(--tn-head); font-size: 1.3rem; line-height: 1; }

/* ==========================================================================
   Home sections
   ========================================================================== */

/* Hero */
.tn-hero { padding-block: clamp(3rem, 8vw, 6rem) 0 !important; overflow: hidden; position: relative; background: linear-gradient(180deg, var(--tn-white) 0%, var(--tn-white) 55%, var(--tn-mist) 100%); }
.tn-hero__title { font-size: var(--wp--preset--font-size--display) !important; line-height: .95 !important; letter-spacing: -.04em !important; margin-block: .5rem 0 !important; }
.tn-hero__title span { white-space: nowrap; background: linear-gradient(90deg, var(--tn-cyan), var(--tn-ice) 60%, var(--tn-cyan)); background-size: 200% 100%; -webkit-background-clip: text; background-clip: text; color: transparent; animation: tn-sheen 6s linear infinite; }
.tn-hero__lede { max-width: 44ch; margin-inline: auto !important; color: var(--tn-muted); font-size: clamp(1.05rem, 1.5vw, 1.3rem); margin-block-start: 1.5rem !important; }
.tn-hero__actions { margin-block-start: 2rem !important; }

.tn-stage { --mx: 0; --my: 0; --sy: 0; position: relative; height: clamp(520px, 62vw, 760px); margin-block-start: clamp(2.5rem, 5vw, 4rem) !important; display: flex; justify-content: center; align-items: flex-start; max-width: 1320px !important; }
.tn-stage__glow { display: block; position: absolute; left: 50%; top: 35%; width: min(900px, 120vw); aspect-ratio: 1.6; transform: translate(-50%, -50%); background: radial-gradient(closest-side, rgba(91, 208, 240, .5), rgba(1, 177, 224, .12) 60%, transparent); filter: blur(10px); pointer-events: none; }
.tn-stage__phone { --pw: clamp(260px, 26vw, 340px); transform: translate3d(0, calc(var(--sy) * -60px), 0); z-index: 2; }
.tn-stage__orbit { position: absolute; z-index: 3; --depth: 1; transform: translate3d(calc(var(--mx) * var(--k) * 40px), calc(var(--my) * var(--k) * 30px + var(--sy) * var(--k) * -120px), 0); transition: transform .6s var(--tn-ease); }
.tn-stage__orbit > * { animation: tn-float 7s ease-in-out infinite; }
.tn-stage__orbit:nth-of-type(1) { --k: .4; left: 8%; top: 12%; }
.tn-stage__orbit:nth-of-type(2) { --k: .9; left: 18%; top: 46%; }
.tn-stage__orbit:nth-of-type(3) { --k: .6; right: 10%; top: 8%; }
.tn-stage__orbit:nth-of-type(4) { --k: 1.1; right: 22%; top: 36%; }
.tn-stage__orbit:nth-of-type(5) { --k: .5; left: 4%; top: 74%; }
.tn-stage__orbit:nth-of-type(6) { --k: .8; right: 6%; top: 64%; }
.tn-stage__orbit:nth-of-type(2) > * { animation-delay: -2s; }
.tn-stage__orbit:nth-of-type(3) > * { animation-delay: -4s; }
.tn-stage__orbit:nth-of-type(4) > * { animation-delay: -1s; }
.tn-stage__orbit:nth-of-type(5) > * { animation-delay: -3s; }
.tn-stage__orbit:nth-of-type(6) > * { animation-delay: -5s; }
@media (max-width: 781px) {
	.tn-stage { height: 520px; }
	.tn-stage__phone { --pw: 250px; }
	.tn-stage__orbit:nth-of-type(2), .tn-stage__orbit:nth-of-type(4), .tn-stage__orbit:nth-of-type(5) { display: none; }
	.tn-stage__orbit:nth-of-type(1) { left: -6%; top: 10%; }
	.tn-stage__orbit:nth-of-type(3) { right: -5%; top: 34%; }
	.tn-stage__orbit:nth-of-type(6) { left: -4%; top: 62%; right: auto; }
	.tn-float { transform: scale(.72); transform-origin: left center; }
	.tn-stage__orbit:nth-of-type(3) .tn-float { transform-origin: right center; }
	.tn-why__visual .tn-stage__orbit, .tn-shero__visual .tn-stage__orbit { display: none; }
}

/* Explore */
.tn-explore { padding-block: var(--tn-section) !important; background: var(--tn-mist); }
.tn-features { display: grid; grid-template-columns: repeat(4, 1fr); gap: clamp(1rem, 2vw, 1.5rem); margin-block-start: clamp(2.5rem, 5vw, 4rem) !important; }
.tn-feature { padding: 2rem 1.6rem; border-radius: var(--tn-radius); background: var(--tn-white); box-shadow: 0 0 0 1px rgba(0, 0, 0, .04); transition: transform .5s var(--tn-ease), box-shadow .5s; }
.tn-feature:hover { transform: translateY(-6px); box-shadow: 0 30px 60px -30px rgba(0, 30, 38, .3); }
.tn-feature__icon { display: grid; place-items: center; width: 64px; height: 64px; border-radius: 20px; background: var(--tn-black); color: var(--tn-ice); margin-bottom: 1.6rem; }
.tn-feature__icon .tn-icon { width: 30px; height: 30px; }
.tn-feature h3 { font-size: 1.3rem; margin: 0 0 .5rem; }
.tn-feature p { margin: 0; color: var(--tn-muted); font-size: .95rem; }
@media (max-width: 1000px) { .tn-features { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .tn-features { grid-template-columns: 1fr; } }

/* Possibilities */
.tn-poss { padding-block: var(--tn-section) !important; background: linear-gradient(180deg, var(--tn-ice) 0%, #7fdcf4 100%); overflow: hidden; }
.tn-poss__head { gap: 1.5rem; flex-wrap: wrap; }
.tn-poss__head h2 { font-size: var(--wp--preset--font-size--xx-large); margin: 0; }
.tn-poss__head .tn-eyebrow { color: rgba(0, 0, 0, .6); }
.tn-poss__rail { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(1rem, 2vw, 1.75rem); margin-block-start: clamp(2.5rem, 5vw, 4rem) !important; }
.tn-poss__card {
	position: relative; display: flex; flex-direction: column; gap: 1rem;
	padding: 1.25rem; border-radius: 32px; background: var(--tn-white);
	box-shadow: 0 0 0 3px var(--tn-black), 10px 12px 0 0 var(--tn-black);
	aspect-ratio: 9 / 15; transition: transform .6s var(--tn-ease), box-shadow .6s var(--tn-ease);
}
.tn-poss__card:nth-child(even) { margin-top: 2.5rem; }
.tn-poss__card:hover { transform: translate(-4px, -6px) rotate(-1deg); box-shadow: 0 0 0 3px var(--tn-black), 16px 20px 0 0 var(--tn-black); }
.tn-poss__bar .tn-icon { width: 22px; height: 22px; }
.tn-poss__card h3 { font-family: var(--tn-head); font-size: clamp(1.6rem, 2.6vw, 2.4rem); line-height: .95; letter-spacing: -.03em; margin: 0; }
.tn-poss__art { flex: 1; position: relative; border-radius: 22px; overflow: hidden; background: radial-gradient(120% 90% at 30% 10%, var(--tn-ice), var(--tn-cyan) 45%, var(--tn-deep)); display: grid; place-items: center; color: var(--tn-white); }
.tn-poss__art .tn-icon { width: 46%; height: auto; stroke-width: 1; position: relative; z-index: 2; transition: transform .8s var(--tn-ease); }
.tn-poss__card:hover .tn-poss__art .tn-icon { transform: scale(1.08) rotate(-4deg); }
.tn-poss__art span { position: absolute; border-radius: 50%; border: 1px solid rgba(255, 255, 255, .35); width: 70%; aspect-ratio: 1; animation: tn-spin 18s linear infinite; }
.tn-poss__art span + span { width: 110%; border-style: dashed; animation-duration: 30s; animation-direction: reverse; }
.tn-poss__card p { margin: 0; font-size: .88rem; color: var(--tn-muted); line-height: 1.45; }
@media (max-width: 1000px) {
	.tn-poss__rail { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; padding: 0 1rem 2rem 4px; margin-inline: calc(var(--tn-gutter) * -1) !important; padding-inline: var(--tn-gutter); scrollbar-width: none; }
	.tn-poss__rail::-webkit-scrollbar { display: none; }
	.tn-poss__card { flex: 0 0 min(72vw, 300px); scroll-snap-align: center; }
	.tn-poss__card:nth-child(even) { margin-top: 0; }
}

/* How it works */
.tn-how { padding-block: var(--tn-section) !important; background: radial-gradient(80% 50% at 80% 30%, rgba(1, 177, 224, .16), transparent 60%), var(--tn-black); }
.tn-how__title { font-size: var(--wp--preset--font-size--xx-large) !important; margin-block-end: clamp(3rem, 6vw, 5rem) !important; }
.tn-how__grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(2rem, 6vw, 6rem); position: relative; }
.tn-how__grid::before { content: ""; position: absolute; left: 50%; top: 0; bottom: 0; width: 1px; background: linear-gradient(transparent, rgba(255, 255, 255, .2) 10%, rgba(255, 255, 255, .2) 90%, transparent); }
.tn-how__steps { list-style: none; margin: 0; padding: 0; }
.tn-how__step { min-height: 72vh; display: flex; flex-direction: column; justify-content: center; opacity: .28; transition: opacity .6s var(--tn-ease); }
.tn-how__step.is-active { opacity: 1; }
.tn-how__num { font-family: var(--tn-head); font-size: .95rem; color: var(--tn-cyan); letter-spacing: .1em; }
.tn-how__step h3 { font-size: clamp(2rem, 4vw, 3.5rem); margin: .5rem 0 1rem; }
.tn-how__step p { font-size: clamp(1.05rem, 1.5vw, 1.35rem); color: rgba(255, 255, 255, .72); max-width: 32ch; margin: 0; }
.tn-how__aside { margin-top: 1.25rem !important; font-family: var(--tn-head); color: var(--tn-ice) !important; letter-spacing: .04em; }
.tn-how__sticky { position: sticky; top: calc(50vh - 300px); height: 600px; display: flex; flex-direction: column; align-items: center; gap: 1.5rem; }
.tn-how__stack { position: relative; width: 300px; height: 580px; }
.tn-how__screen { position: absolute; inset: 0; opacity: 0; transform: translateY(40px) scale(.94); transition: opacity .7s var(--tn-ease), transform .9s var(--tn-ease); }
.tn-how__screen.is-active { opacity: 1; transform: none; }
.tn-how__screen .tn-phone { --pw: 280px; margin-inline: auto; }
.tn-how__dots { display: flex; gap: .5rem; }
.tn-how__dots i { width: 6px; height: 6px; border-radius: 99px; background: rgba(255, 255, 255, .3); transition: width .4s var(--tn-ease), background .4s; }
.tn-how__dots i.is-active { width: 24px; background: var(--tn-cyan); }
.tn-how__inline { display: none; }
@media (max-width: 860px) {
	.tn-how__grid { grid-template-columns: 1fr; }
	.tn-how__grid::before, .tn-how__sticky { display: none; }
	.tn-how__step { min-height: 0; opacity: 1; padding-block: 2rem; border-top: 1px solid rgba(255, 255, 255, .12); }
	.tn-how__inline { display: block; }
}

/* Marquee */
.tn-marquee { --shift: 0; padding-block: clamp(4rem, 9vw, 8rem); overflow: hidden; background: var(--tn-white); font-family: var(--tn-head); line-height: 1; letter-spacing: -.04em; }
.tn-marquee__line { display: flex; white-space: nowrap; font-size: clamp(3.5rem, 11vw, 11rem); will-change: transform; transform: translate3d(calc(var(--shift) * var(--dir, -1) * 1px - 25%), 0, 0); }
.tn-marquee__line span { padding-right: .3em; }
.tn-marquee__line.is-outline { font-size: clamp(2rem, 5vw, 5rem); color: transparent; -webkit-text-stroke: 1px var(--tn-black); margin-top: .3em; }

/* Category grid (markup from trainow-core) */
.tn-cats { padding-block: var(--tn-section) !important; background: var(--tn-white); }
.tn-cats__head { gap: 2rem; flex-wrap: wrap; }
.tn-cats__head h2 { font-size: var(--wp--preset--font-size--xx-large); margin: 0; }
.tn-cats__lede { max-width: 36ch; color: var(--tn-muted); margin: 0; }
.tn-catgrid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; margin-block-start: clamp(2.5rem, 5vw, 4rem) !important; max-width: var(--wp--style--global--wide-size) !important; margin-inline: auto !important; }
.tn-catcard {
	position: relative; display: flex; flex-direction: column; gap: .5rem; min-height: 230px;
	padding: 1.6rem; border-radius: var(--tn-radius); background: var(--tn-mist); color: var(--tn-ink) !important;
	text-decoration: none !important; overflow: hidden; isolation: isolate;
	transition: transform .5s var(--tn-ease), color .4s, box-shadow .5s;
}
.tn-catcard::before { content: ""; position: absolute; inset: 0; z-index: -1; background: radial-gradient(120% 100% at 100% 0%, var(--tn-cyan), var(--tn-deep) 60%, var(--tn-black)); opacity: 0; transition: opacity .5s var(--tn-ease); }
.tn-catcard:hover { transform: translateY(-6px); color: var(--tn-white) !important; box-shadow: 0 30px 60px -30px rgba(0, 30, 38, .6); }
.tn-catcard:hover::before { opacity: 1; }
.tn-catcard__icon { width: 52px; height: 52px; border-radius: 16px; display: grid; place-items: center; background: var(--tn-white); color: var(--tn-black); transition: transform .6s var(--tn-ease), background .4s; }
.tn-catcard:hover .tn-catcard__icon { transform: rotate(-10deg) scale(1.1); background: var(--tn-cyan); }
.tn-catcard__icon .tn-icon { width: 26px; height: 26px; }
.tn-catcard__name { font-family: var(--tn-head); font-size: 1.6rem; line-height: 1.05; margin-top: auto; }
.tn-catcard__list { font-size: .82rem; opacity: .65; line-height: 1.45; }
.tn-catcard__count { position: absolute; top: 1.6rem; right: 1.6rem; font-size: .78rem; opacity: .6; }
.tn-catcard__arrow { position: absolute; right: 1.4rem; bottom: 1.4rem; opacity: 0; transform: translateX(-8px); transition: .4s var(--tn-ease); }
.tn-catcard:hover .tn-catcard__arrow { opacity: 1; transform: none; }
.tn-catgrid.is-compact .tn-catcard { min-height: 0; }
.tn-catgrid.is-compact .tn-catcard__list { display: none; }
@media (max-width: 1000px) { .tn-catgrid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .tn-catgrid { grid-template-columns: 1fr; } .tn-catcard { min-height: 180px; } }

/* Why */
.tn-why { padding-block: var(--tn-section) !important; background: linear-gradient(180deg, var(--tn-black), var(--tn-deep)); overflow: hidden; }
.tn-why__grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(2rem, 6vw, 6rem); align-items: center; }
.tn-why h2 { font-size: var(--wp--preset--font-size--xx-large); }
.tn-why p:not(.tn-eyebrow) { color: rgba(255, 255, 255, .72); font-size: 1.15rem; max-width: 42ch; }
.tn-why__visual { position: relative; display: flex; justify-content: center; min-height: 620px; align-items: center; }
.tn-why__visual .tn-stage__orbit:nth-of-type(1) { left: -6%; top: 6%; }
.tn-why__visual .tn-stage__orbit:nth-of-type(2) { right: -6%; top: 76%; }
.tn-why__phone { --pw: 290px; position: relative; z-index: 2; }
@media (max-width: 860px) { .tn-why__grid { grid-template-columns: 1fr; } .tn-why__visual { min-height: 560px; } }

/* Testimonials */
.tn-quotes { padding-block: var(--tn-section) !important; background: var(--tn-white); }
.tn-quotes h2 { font-size: var(--wp--preset--font-size--xx-large); }
.tn-quotes__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; margin-block-start: clamp(2.5rem, 5vw, 4rem) !important; }
.tn-quote { margin: 0; padding: 2rem; border-radius: var(--tn-radius); background: var(--tn-mist); display: flex; flex-direction: column; gap: 1.25rem; }
.tn-quote:nth-child(2) { transform: translateY(2rem); }
.tn-quote__stars { display: flex; gap: 2px; color: var(--tn-cyan); }
.tn-quote__stars .tn-icon { width: 16px; height: 16px; fill: currentColor; }
.tn-quote blockquote { margin: 0; }
.tn-quote blockquote p { font-family: var(--tn-head); font-size: clamp(1.3rem, 2vw, 1.6rem); line-height: 1.25; margin: 0; letter-spacing: -.01em; }
.tn-quote figcaption { margin-top: auto; display: flex; align-items: center; gap: .75rem; font-size: .9rem; }
.tn-quote .tn-av { width: 40px; height: 40px; font-size: .75rem; }
@media (max-width: 860px) { .tn-quotes__grid { grid-template-columns: 1fr; } .tn-quote:nth-child(2) { transform: none; } }

/* Press */
.tn-press { padding-block: 0 clamp(3rem, 6vw, 5rem) !important; background: var(--tn-white); }
.tn-press p { font-size: 1.6rem; font-family: var(--tn-head); }
.tn-press .tn-eyebrow { display: block; }
.tn-press a { text-decoration: none; }

/* Newsletter */
.tn-news { padding-block: 0 var(--tn-section) !important; background: var(--tn-white); }
.tn-news__card { display: grid; grid-template-columns: 1.1fr 1fr; gap: 2rem 4rem; align-items: center; padding: clamp(2rem, 5vw, 4rem); border-radius: 40px; background: radial-gradient(90% 120% at 100% 0%, rgba(91, 208, 240, .45), transparent 60%), var(--tn-mist); }
.tn-news__card h2 { font-size: var(--wp--preset--font-size--x-large); margin: 0 0 1rem; }
.tn-news__card p { color: var(--tn-muted); margin: 0; }
@media (max-width: 860px) { .tn-news__card { grid-template-columns: 1fr; } }
.tn-form { display: grid; gap: .9rem; }
.tn-form__row { display: flex; gap: .5rem; padding: .35rem; border-radius: 99px; background: var(--tn-white); box-shadow: 0 0 0 1px var(--tn-line); }
.tn-form__row:focus-within { box-shadow: 0 0 0 2px var(--tn-cyan); }
.tn-form input[type="email"] { flex: 1; min-width: 0; border: 0; background: transparent; padding: .7rem 1rem; font: inherit; font-size: 1rem; outline: none; }
.tn-form button { border: 0; border-radius: 99px; padding: .8rem 1.4rem; font: inherit; font-weight: 500; background: var(--tn-black); color: var(--tn-white); cursor: pointer; transition: background .3s; }
.tn-form button:hover { background: var(--tn-cyan); color: var(--tn-black); }
.tn-form__consent { display: flex; gap: .6rem; align-items: flex-start; font-size: .85rem; color: var(--tn-muted); }
.tn-form__consent input { margin-top: .25rem; accent-color: var(--tn-cyan); }
.tn-form__hp { position: absolute !important; left: -9999px !important; }
.tn-form__msg { font-size: .9rem; padding: .7rem 1rem; border-radius: 14px; background: var(--tn-white); }
.tn-form__msg.is-ok { box-shadow: inset 3px 0 0 var(--tn-cyan); }
.tn-form__msg.is-err { box-shadow: inset 3px 0 0 #e0434b; }

/* CTA */
.tn-cta { padding-block: clamp(4rem, 9vw, 7rem) !important; background: radial-gradient(70% 120% at 85% 50%, rgba(1, 177, 224, .35), transparent 60%), var(--tn-black); overflow: hidden; }
.tn-cta__inner { display: grid; grid-template-columns: 1.3fr 1fr; gap: 2rem; align-items: center; }
.tn-cta h2 { font-size: var(--wp--preset--font-size--xx-large); margin: 0 0 2rem; }
.tn-cta h2 span { color: var(--tn-ice); }
.tn-cta__phone { position: relative; display: flex; justify-content: center; height: 420px; }
.tn-cta__phone .tn-phone { --pw: 260px; position: relative; z-index: 2; margin-top: 1rem; }
@media (max-width: 860px) { .tn-cta__inner { grid-template-columns: 1fr; } .tn-cta__phone { height: 380px; overflow: hidden; } }

/* Footer */
.tn-footer { padding-block: clamp(4rem, 8vw, 6rem) 2rem !important; background: var(--tn-black); }
.tn-cta + .tn-footer, .tn-main:has(> .tn-cta:last-child) + * .tn-footer { border-top: 1px solid rgba(255, 255, 255, .1); }
.tn-footer__top { display: grid; grid-template-columns: 1.2fr 1fr; gap: 2rem; align-items: end; padding-bottom: clamp(3rem, 6vw, 5rem); border-bottom: 1px solid rgba(255, 255, 255, .12); }
.tn-footer__mark { margin: 0; font-family: var(--tn-head); font-size: clamp(4rem, 14vw, 13rem); line-height: .8; letter-spacing: -.05em; }
.tn-footer__mark a { text-decoration: none; background: linear-gradient(180deg, #fff 30%, rgba(255, 255, 255, .25)); -webkit-background-clip: text; background-clip: text; color: transparent !important; }
.tn-footer__tag { font-size: var(--wp--preset--font-size--large) !important; margin: 0 0 1.5rem; color: rgba(255, 255, 255, .8); }
.tn-footer__cols { display: grid; grid-template-columns: repeat(4, 1fr); gap: 2rem; padding-block: 3rem; }
.tn-footer__list, .tn-catlinks { list-style: none; padding: 0; margin: 0; display: grid; gap: .5rem; font-size: .92rem; }
.tn-footer__list a, .tn-catlinks a { text-decoration: none; opacity: .75; transition: opacity .2s, color .2s; }
.tn-footer__list a:hover, .tn-catlinks a:hover { opacity: 1; color: var(--tn-ice) !important; }
.tn-footer__legal { padding-top: 2rem; border-top: 1px solid rgba(255, 255, 255, .12); font-size: .78rem; opacity: .55; gap: 1rem; }
.tn-footer__legal p { margin: 0; }
@media (max-width: 860px) { .tn-footer__top { grid-template-columns: 1fr; } .tn-footer__cols { grid-template-columns: repeat(2, 1fr); } }

/* ==========================================================================
   Pages, posts, prose
   ========================================================================== */
.tn-page-head { padding-block: clamp(4rem, 10vw, 8rem) clamp(2rem, 4vw, 3rem) !important; }
.tn-page-head h1 { font-size: var(--wp--preset--font-size--xx-large); }
.tn-prose { padding-bottom: var(--tn-section); }
.tn-prose h2 { font-size: var(--wp--preset--font-size--x-large); margin-block: 3.5rem 1rem; }
.tn-prose h3 { margin-block: 2rem .5rem; }
.tn-prose p, .tn-prose li { font-size: 1.07rem; }
.tn-prose a { text-decoration-color: var(--tn-cyan); text-underline-offset: 3px; }
.tn-prose .wp-block-details summary { font-family: var(--tn-head); font-size: 1.25rem; cursor: pointer; list-style: none; display: flex; justify-content: space-between; gap: 1rem; }
.tn-prose .wp-block-details summary::-webkit-details-marker { display: none; }
.tn-prose .wp-block-details summary::after { content: "+"; font-family: var(--tn-body); font-weight: 300; font-size: 1.5rem; line-height: 1; transition: transform .3s var(--tn-ease); }
.tn-prose .wp-block-details[open] summary::after { transform: rotate(45deg); }
.tn-prose .wp-block-details > :not(summary) { color: var(--tn-muted); margin-top: .75rem; }
.tn-notice { padding: 1.25rem 1.5rem; border-radius: 18px; background: #fff6e0; box-shadow: inset 3px 0 0 #f0a400; }

.tn-meta { gap: 1rem; font-size: .85rem; color: var(--tn-muted); }
.tn-meta a { text-decoration: none; }
.tn-feature.wp-block-post-featured-image, .tn-article .tn-feature img { border-radius: var(--tn-radius); overflow: hidden; }
.tn-posts { padding-bottom: var(--tn-section); }
.tn-card { display: flex; flex-direction: column; gap: .5rem; }
.tn-card .wp-block-post-featured-image { border-radius: 22px; overflow: hidden; margin-bottom: .75rem; }
.tn-card .wp-block-post-featured-image img { transition: transform .8s var(--tn-ease); }
.tn-card:hover .wp-block-post-featured-image img { transform: scale(1.04); }
.tn-card__meta { font-size: .8rem; color: var(--tn-muted); }
.tn-card__title { font-size: 1.5rem !important; margin: 0; }
.tn-card__title a { text-decoration: none; }
.tn-404 { padding-block: var(--tn-section) !important; }
.tn-404 h1 { font-size: var(--wp--preset--font-size--xx-large); }

/* Landing pages (page-wide / page-dark templates) */
.tn-landing > .wp-block-post-content > * { margin-block: 0; }
.tn-landing--dark { background: var(--tn-black); color: var(--tn-white); }
.tn-band { padding-block: var(--tn-section) !important; }
.tn-band--mist { background: var(--tn-mist); }
.tn-band--dark { background: var(--tn-black); color: var(--tn-white); }
.tn-band h1 { font-size: var(--wp--preset--font-size--display); line-height: .95; letter-spacing: -.04em; }
.tn-band h2 { font-size: var(--wp--preset--font-size--x-large); }
.tn-band > h2:not(:first-child), .tn-band > h3:not(:first-child) { margin-top: clamp(3rem, 6vw, 5rem) !important; }
.tn-band > .tn-steps-grid { margin-top: 2rem !important; }
.tn-cta__copy h1 { font-size: var(--wp--preset--font-size--xx-large); margin: 0 0 1.25rem; }
.tn-cta__copy .tn-stores { margin-top: 2rem; }
.tn-main > .is-layout-constrained > .tn-lede, .tn-prose > .tn-lede { margin-left: max(0px, calc((100% - var(--wp--style--global--content-size)) / 2)) !important; }
.tn-band > .tn-lede, .tn-band > p:not(.tn-eyebrow), .tn-band > .wp-block-list { max-width: 62ch !important; margin-left: calc((100% - min(100%, 1240px)) / 2) !important; margin-right: auto !important; }
.tn-band > .tn-lede { max-width: 40ch !important; }
.tn-band--dark .wp-block-button:not(.is-style-ghost) .wp-block-button__link { background: var(--tn-white); color: var(--tn-black); }
.tn-band--dark .wp-block-button:not(.is-style-ghost) .wp-block-button__link:hover { background: var(--tn-cyan); }
.tn-band--dark .tn-lede, .tn-band--dark .tn-eyebrow { color: rgba(255, 255, 255, .65); }
.tn-steps-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; }
.tn-steps-grid:has(> :nth-child(4):last-child) { grid-template-columns: repeat(4, 1fr); }
@media (max-width: 1000px) { .tn-steps-grid, .tn-steps-grid:has(> :nth-child(4):last-child) { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .tn-steps-grid, .tn-steps-grid:has(> :nth-child(4):last-child) { grid-template-columns: 1fr; } }
.tn-steps-grid > * { padding: 2rem; border-radius: var(--tn-radius); background: var(--tn-mist); margin: 0 !important; }
.tn-band--dark .tn-steps-grid > * { background: rgba(255, 255, 255, .06); }
.tn-steps-grid h3 { font-size: 1.4rem; }
.tn-steps-grid p { color: var(--tn-muted); margin-bottom: 0; }
.tn-band--dark .tn-steps-grid p { color: rgba(255, 255, 255, .65); }

/* ==========================================================================
   Sport + category pages (markup from trainow-core)
   ========================================================================== */
.tn-crumbs { font-size: .82rem; color: var(--tn-muted); display: flex; flex-wrap: wrap; gap: .4rem; list-style: none; padding: 0; margin: 0 0 1.5rem; }
.tn-crumbs li + li::before { content: "/"; margin-right: .4rem; opacity: .5; }
.tn-crumbs a { text-decoration: none; }
.tn-shero { padding: clamp(2.5rem, 6vw, 5rem) var(--tn-gutter) 0; overflow: hidden; background: linear-gradient(180deg, var(--tn-white), var(--tn-mist)); }
.tn-shero__grid { max-width: var(--wp--style--global--wide-size); margin: 0 auto; display: grid; grid-template-columns: 1.15fr 1fr; gap: 2rem; align-items: center; }
.tn-shero h1 { font-size: clamp(2.5rem, 4.6vw, 4.25rem); line-height: .98; letter-spacing: -.035em; margin: .25rem 0 1.25rem; }
.tn-shero h1 span { display: block; color: var(--tn-cyan); }
.tn-shero .tn-lede { margin-bottom: 2rem; }
.tn-shero__cat { display: inline-flex; align-items: center; gap: .5rem; text-decoration: none; font-size: .8rem; font-weight: 500; letter-spacing: .12em; text-transform: uppercase; padding: .45rem .9rem .45rem .6rem; border-radius: 99px; background: var(--tn-black); color: var(--tn-white) !important; }
.tn-shero__cat .tn-icon { color: var(--tn-ice); width: 18px; height: 18px; }
.tn-shero__facts { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: 1.75rem; padding: 0; list-style: none; }
.tn-shero__facts li { display: inline-flex; align-items: center; gap: .4rem; padding: .5rem .9rem; border-radius: 99px; background: var(--tn-white); box-shadow: 0 0 0 1px var(--tn-line); font-size: .84rem; }
.tn-shero__facts .tn-icon { width: 16px; height: 16px; color: var(--tn-cyan); }
.tn-shero__visual { position: relative; display: flex; justify-content: center; height: clamp(520px, 50vw, 640px); }
.tn-shero__visual .tn-phone { --pw: clamp(250px, 23vw, 300px); position: relative; z-index: 2; margin-top: 1rem; }
.tn-shero__visual .tn-stage__orbit:nth-of-type(1) { right: -4%; top: 8%; }
.tn-shero__visual .tn-stage__orbit:nth-of-type(2) { left: -2%; bottom: 14%; }
@media (max-width: 860px) { .tn-shero__grid { grid-template-columns: 1fr; } .tn-shero__visual { height: 500px; } }
.tn-sport__body { background: var(--tn-white); padding-top: clamp(3rem, 6vw, 5rem) !important; }
.tn-sport__body .tn-prose > h2:first-child { margin-top: 0; }

.tn-related { padding: var(--tn-section) var(--tn-gutter); background: var(--tn-mist); }
.tn-related__in { max-width: var(--wp--style--global--wide-size); margin: 0 auto; }
.tn-related h2 { font-size: var(--wp--preset--font-size--x-large); margin: 0 0 2rem; }
.tn-pills { display: flex; flex-wrap: wrap; gap: .6rem; list-style: none; padding: 0; margin: 0; }
.tn-pills a { display: inline-flex; align-items: center; gap: .5rem; padding: .7rem 1.2rem; border-radius: 99px; background: var(--tn-white); box-shadow: 0 0 0 1px var(--tn-line); text-decoration: none; font-size: .95rem; transition: background .3s, color .3s, transform .3s var(--tn-ease); }
.tn-pills a:hover { background: var(--tn-black); color: var(--tn-white); transform: translateY(-2px); }
.tn-pills a .tn-icon { width: 16px; height: 16px; opacity: .5; }
.tn-related__more { margin-top: 2.5rem; }

.tn-hubhead { padding: clamp(4rem, 10vw, 8rem) var(--tn-gutter) clamp(2rem, 4vw, 3rem); }
.tn-hubhead__in { max-width: var(--wp--style--global--wide-size); margin: 0 auto; }
.tn-hubhead h1 { font-size: var(--wp--preset--font-size--display); line-height: .92; letter-spacing: -.045em; margin: 0 0 1.5rem; }
.tn-hubhead h1 span { color: var(--tn-cyan); }
.tn-hubhead--cat h1 { font-size: var(--wp--preset--font-size--xx-large); line-height: .98; letter-spacing: -.035em; }
.tn-hubhead .tn-catgrid { margin-top: 3rem !important; }
.tn-hubjump { position: sticky; top: calc(var(--tn-header-h) + var(--wp-admin--admin-bar--height, 0px)); z-index: 20; background: rgba(255, 255, 255, .85); -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px); border-block: 1px solid var(--tn-line); }
.tn-hubjump ul { max-width: var(--wp--style--global--wide-size); margin: 0 auto; padding: .7rem var(--tn-gutter); list-style: none; display: flex; gap: .4rem; overflow-x: auto; scrollbar-width: none; }
.tn-hubjump a { display: inline-block; white-space: nowrap; padding: .45rem .9rem; border-radius: 99px; font-size: .85rem; text-decoration: none; }
.tn-hubjump a:hover { background: var(--tn-mist); }
.tn-hubsec { padding: clamp(3rem, 6vw, 5rem) var(--tn-gutter); border-bottom: 1px solid var(--tn-line); }
.tn-hubsec__in { max-width: var(--wp--style--global--wide-size); margin: 0 auto; display: grid; grid-template-columns: 1fr 2fr; gap: 2rem 4rem; }
.tn-hubsec h2 { font-size: var(--wp--preset--font-size--x-large); margin: 0 0 1rem; display: flex; align-items: center; gap: .75rem; }
.tn-hubsec h2 .tn-icon { width: 40px; height: 40px; padding: 8px; border-radius: 12px; background: var(--tn-black); color: var(--tn-ice); }
.tn-hubsec h2 a { text-decoration: none; }
.tn-hubsec p { color: var(--tn-muted); margin: 0 0 1rem; }
@media (max-width: 860px) { .tn-hubsec__in { grid-template-columns: 1fr; } }

.tn-sportgrid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; list-style: none; padding: 0; margin: 0; }
.tn-sportcard { display: flex; flex-direction: column; gap: .5rem; height: 100%; padding: 1.6rem; border-radius: var(--tn-radius); background: var(--tn-mist); text-decoration: none !important; color: inherit; transition: transform .5s var(--tn-ease), background .4s, color .4s; box-sizing: border-box; }
.tn-sportcard:hover { transform: translateY(-5px); background: var(--tn-black); color: var(--tn-white); }
.tn-sportcard b { font-family: var(--tn-head); font-size: 1.5rem; font-weight: 400; line-height: 1.1; }
.tn-sportcard span { font-size: .88rem; opacity: .65; }
.tn-sportcard i { margin-top: auto; padding-top: 1rem; font-style: normal; font-size: .85rem; display: inline-flex; align-items: center; gap: .4rem; color: var(--tn-cyan); }
@media (max-width: 1000px) { .tn-sportgrid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .tn-sportgrid { grid-template-columns: 1fr; } }
.tn-catpage__body { padding: 0 var(--tn-gutter) var(--tn-section); }
.tn-catpage__body > div { max-width: var(--wp--style--global--wide-size); margin: 0 auto; }
.tn-catpage__intro { max-width: 760px; padding-block: clamp(3rem, 6vw, 5rem) 0; }
.tn-catpage__intro h2 { font-size: var(--wp--preset--font-size--x-large); }
.tn-catpage__intro p { font-size: 1.07rem; }

/* ---------- Keyframes ---------- */
@keyframes tn-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-14px); } }
@keyframes tn-bob { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-2.4cqw); } }
@keyframes tn-pulse { 0% { transform: scale(.6); opacity: .9; } 100% { transform: scale(2.2); opacity: 0; } }
@keyframes tn-eta { from { width: 35%; } to { width: 85%; } }
@keyframes tn-pop { 0% { transform: scale(.3); opacity: 0; } 70% { transform: scale(1.15); } 100% { transform: scale(1); opacity: 1; } }
@keyframes tn-ring { from { stroke-dashoffset: 90; } to { stroke-dashoffset: 18; } }
@keyframes tn-spin { to { transform: rotate(360deg); } }
@keyframes tn-sheen { to { background-position: -200% 0; } }

@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; scroll-behavior: auto !important; }
	.tn-js .tn-reveal { opacity: 1; transform: none; }
}