/* Know Your Gains website. Tokens follow the KYG design system. */
@font-face{font-family:"KYG Display";src:url(/assets/fonts/barlow-condensed-latin-700-normal.woff2) format("woff2");font-weight:700;font-display:swap}
@font-face{font-family:"KYG Display";src:url(/assets/fonts/barlow-condensed-latin-800-normal.woff2) format("woff2");font-weight:800;font-display:swap}
@font-face{font-family:"KYG Display";src:url(/assets/fonts/barlow-condensed-latin-900-normal.woff2) format("woff2");font-weight:900;font-display:swap}
@font-face{font-family:"KYG Body";src:url(/assets/fonts/manrope-latin-400-normal.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"KYG Body";src:url(/assets/fonts/manrope-latin-600-normal.woff2) format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:"KYG Body";src:url(/assets/fonts/manrope-latin-700-normal.woff2) format("woff2");font-weight:700;font-display:swap}
@font-face{font-family:"KYG Body";src:url(/assets/fonts/manrope-latin-800-normal.woff2) format("woff2");font-weight:800;font-display:swap}

:root{
  --bg:#f2efe8;--panel:#fff;--ink:#171b1e;--ink-2:#3a4045;--muted:#61666b;--line:#e0ded7;--soft:#eeece6;
  --orange:#ff5a1f;--orange-top:#ff712f;--orange-border:#ff873f;--accent-ink:#a5360b;--accent-bg:#fff0e5;--focus:#c4410e;
  --charcoal:#121416;--navy:#1c2429;--dline:#35434c;--dsoft:#273139;--chalk:#f2efe8;--dmuted:#afbec8;--dtext:#c9d3da;
  --c-workout:#ff763d;--c-meals:#42d5bd;--c-supps:#b397ff;--c-sleep:#f2c447;--c-weight:#fa86b4;--c-neutral:#a3a9ae;
  --display:"KYG Display","Arial Narrow",sans-serif;--body:"KYG Body","Segoe UI",system-ui,sans-serif;
  --gut:clamp(16px,4vw,48px);--max:1280px;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--body);font-size:16px;line-height:1.5;overflow-x:hidden;overflow-x:clip}
main{overflow-x:hidden;overflow-x:clip}
img,svg{display:block;max-width:100%}
a{color:inherit;text-decoration-thickness:1.5px;text-underline-offset:3px}
a:hover{color:var(--accent-ink)}
:focus-visible{outline:3px solid var(--focus);outline-offset:3px;border-radius:4px}
.dark :focus-visible,.bar :focus-visible,.foot :focus-visible{outline-color:#ff9a70}
h1,h2,h3,p{margin:0}
.wrap{max-width:var(--max);margin:0 auto;padding-left:var(--gut);padding-right:var(--gut)}
.wrap-narrow{max-width:920px;margin:0 auto;padding-left:var(--gut);padding-right:var(--gut)}
.skip{position:absolute;left:12px;top:-60px;z-index:20;background:var(--charcoal);color:var(--chalk);padding:10px 14px;border-radius:7px;font-weight:700}
.skip:focus{top:12px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.muted{color:var(--muted);font-weight:600;font-size:14px}
.small{font-size:14px}

/* brand bar */
.bar{background:var(--charcoal);color:var(--chalk)}
.bar-in{display:flex;flex-wrap:wrap;gap:16px;align-items:center;justify-content:space-between;padding-top:14px;padding-bottom:14px}
.brand,.brand:hover{color:var(--chalk);display:block}
.logo{height:56px;width:auto}
.nav{display:flex;flex-wrap:wrap;gap:22px;align-items:center;font-size:14px;font-weight:700}
.nav a{color:var(--chalk);text-decoration:none;padding:10px 0}
.nav a:hover{color:#ff9565}
.lg{transform-box:fill-box;transform-origin:center}
.lg-1,.lg-2,.lg-3{animation:in-l .9s cubic-bezier(.2,.9,.25,1.15) both}
.lg-7,.lg-8,.lg-9{animation:in-r .9s cubic-bezier(.2,.9,.25,1.15) both}
.lg-4,.lg-5,.lg-6{animation:drop .7s cubic-bezier(.2,.9,.25,1.2) both}
.lg-1,.lg-9{animation-delay:.35s}.lg-2,.lg-8{animation-delay:.2s}.lg-3,.lg-7{animation-delay:.05s}
.lg-4{animation-delay:.7s}.lg-5{animation-delay:.82s}.lg-6{animation-delay:.94s}
.lg-word{animation:fade .6s ease-out 1.1s both}
.brand .logo{animation:rep 5s ease-in-out 2.2s infinite}

/* "coming soon" badge */
.soon{display:inline-flex;align-items:center;gap:10px;min-height:48px;padding:0 22px;border-radius:7px;background:var(--accent-bg);color:var(--accent-ink);border:1.5px dashed var(--accent-ink);font-weight:800;font-size:16px;white-space:nowrap}
.soon::before{content:"";width:9px;height:9px;border-radius:50%;background:var(--orange);animation:pulse 1.8s ease-out infinite}
.soon-sm{min-height:40px;padding:0 14px;font-size:13px;background:#35271e;color:#ff9565;border-color:#ff9565}
.soon-dark{background:var(--charcoal);color:var(--chalk);border-color:var(--charcoal)}

/* hero */
.hero-band{position:relative;overflow:hidden}
.hero-band::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,#d9e6ee 0%,#e8eff3 60%,#f2efe8 100%);animation:thaw 2.8s ease-out .3s both;pointer-events:none}
.hero-band::after{content:"";position:absolute;inset:0;background:radial-gradient(#ffffffcc 1.5px,transparent 2px) 0 0/46px 46px,radial-gradient(#ffffff99 1px,transparent 1.5px) 23px 17px/38px 38px;animation:thaw 2.2s ease-out .2s both;pointer-events:none}
.hero{position:relative;z-index:1}
.hero{display:flex;flex-wrap:wrap;gap:32px;align-items:center;padding-top:56px;padding-bottom:90px}
.hero-copy{flex:999 1 560px;min-width:0;display:flex;flex-direction:column;gap:28px;position:relative;z-index:2}
.h-hero{font-family:var(--display);font-weight:900;font-size:clamp(60px,8.6vw,128px);line-height:.86;letter-spacing:-1.5px}
.h-summer{display:inline-block;font-size:1.32em;line-height:.9;padding:0 .06em .04em 0;background:linear-gradient(100deg,#ff5a1f 0%,#ff8a2a 30%,#ffc04d 50%,#ff8a2a 70%,#ff5a1f 100%);background-size:220% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(5px 5px 0 #121416);transform:rotate(-2deg);transform-origin:left bottom;animation:sheen 6s linear infinite}
.h-winter{display:inline-block;color:var(--ink);text-shadow:4px 4px 0 #9fd4ee,8px 8px 0 #d8eef8}
.lede{max-width:560px;font-size:clamp(17px,1.6vw,20px);line-height:1.5;color:var(--ink-2)}
.hero-cta{display:flex;flex-wrap:wrap;gap:18px;align-items:center}
.rise{animation:fade .7s ease-out both}.r1{animation-delay:.5s}.r2{animation-delay:.65s}.r3{animation-delay:.8s}
.hero-art{flex:1 1 400px;min-width:0;position:relative;height:680px;display:flex;align-items:center;justify-content:center}
.sun-lift{position:absolute;inset:0;pointer-events:none;transform:translateY(calc(var(--p,0) * -110px)) scale(calc(1 + var(--p,0) * .14));will-change:transform}
.sun{position:absolute;width:560px;height:560px;left:50%;top:50%;margin:-280px 0 0 -280px;animation:sunrise 2.4s cubic-bezier(.2,.8,.2,1) both;pointer-events:none}
.rays{position:absolute;inset:0;width:560px;height:560px;animation:spin 60s linear infinite}
.rays line{stroke:var(--orange);stroke-width:10;stroke-linecap:round}
.sun-disc{position:absolute;inset:70px;border-radius:50%;background:radial-gradient(circle at 38% 35%,#ffe08a,var(--c-sleep) 55%,#f0a93a);box-shadow:0 0 120px #f2c44799;animation:glow 4.5s ease-in-out infinite alternate}
.bob{position:relative;z-index:2;animation:bob 4s ease-in-out infinite}
.count{align-self:flex-start;padding:16px 18px;border-radius:13px;background:var(--charcoal);color:var(--chalk);box-shadow:0 18px 40px #12141640}
.count-l{display:block;font-size:12px;font-weight:700;color:#ff9565}
.count-n{display:flex;gap:12px;font-family:var(--display);font-weight:800;font-variant-numeric:tabular-nums}
.count-n span{display:flex;flex-direction:column;align-items:center;min-width:34px}
.count-n b{font-size:38px;line-height:1}
.count-n i{font-style:normal;font-family:var(--body);font-size:11px;font-weight:700;color:var(--dmuted)}
.badge{position:absolute;z-index:3;padding:12px 16px;border-radius:999px;color:var(--charcoal);font-weight:800;font-size:15px}
.badge-teal{right:-60px;top:150px;background:var(--c-meals);box-shadow:0 14px 30px #42d5bd55}
.badge-pink{left:-40px;bottom:50px;background:var(--c-weight);box-shadow:0 14px 30px #fa86b455}
.b2{animation-delay:1.3s}.b3{animation-delay:2.1s}

/* phone */
.phone{width:300px;height:620px;border-radius:44px;padding:10px;background:#2a3238;box-shadow:0 30px 80px #00000060,inset 0 0 0 1px #4a565e}
.ph-screen{width:100%;height:100%;border-radius:35px;overflow:hidden;background:var(--charcoal);color:var(--chalk);display:flex;flex-direction:column}
.ph-body{position:relative;flex-grow:1;padding:26px 14px 10px;display:flex;flex-direction:column;gap:10px}
.ph-head{display:flex;justify-content:space-between;align-items:flex-end}
.ph-head>div{display:flex;flex-direction:column;gap:3px}
.ph-title{font-family:var(--display);font-weight:700;font-size:34px;line-height:.95}
.ph-date{font-size:11px;color:var(--dmuted)}
.ph-av{width:32px;height:32px;border-radius:50%;background:var(--orange);color:var(--charcoal);display:flex;align-items:center;justify-content:center;font-family:var(--display);font-weight:700;font-size:18px;box-shadow:0 0 0 3px #35271e}
.ph-days{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px}
.pd{display:flex;flex-direction:column;align-items:center;gap:2px;padding:5px 0;border-radius:9px;background:var(--navy)}
.pd-on{background:#35271e;color:#ff9565}
.pd-l{font-size:9px;font-weight:700;color:var(--dmuted)}
.pd-n{font-size:12px;font-weight:800}
.pd-dot{width:5px;height:5px;border-radius:50%;background:var(--dline)}
.pd-dot.on{background:#ea6226}
.ph-work{border-radius:13px;padding:12px 13px;background:linear-gradient(120deg,#1d2e3e,#17212c 68%,#242d35);border:1px solid #344758;box-shadow:0 0 18px #ff763d33;display:flex;justify-content:space-between;align-items:center}
.ph-work>div{display:flex;flex-direction:column;gap:3px}
.ph-eye{font-size:11px;font-weight:600;color:#d4dce4}
.ph-name{font-family:var(--display);font-weight:700;font-size:28px;line-height:1}
.ph-meta{font-size:11px;color:#becbd7}
.ph-wtick{width:26px;height:26px;border-radius:50%;background:var(--c-workout);display:flex;align-items:center;justify-content:center}
.ph-wtick .ic{width:14px;height:14px;stroke:var(--charcoal);stroke-width:3}
.ph-cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.pc{--c:var(--c-neutral);display:flex;flex-direction:column;gap:4px;padding:10px 11px;border-radius:13px;background:var(--navy);border:1px solid var(--dline);box-shadow:0 0 18px color-mix(in srgb,var(--c) 20%,transparent)}
.pc-top{display:flex;justify-content:space-between;align-items:center}
.pc-tile{width:24px;height:24px;border-radius:9px;display:flex;align-items:center;justify-content:center;background:color-mix(in srgb,var(--c) 18%,transparent)}
.pc-tile .ic{width:14px;height:14px;stroke:var(--c)}
.pc-tick{width:16px;height:16px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--c)}
.pc-tick .ic{width:10px;height:10px;stroke:var(--charcoal);stroke-width:3.5}
.pc-t{font-size:11px;font-weight:600;color:var(--dmuted)}
.pc-v{font-size:17px;font-weight:800;letter-spacing:-.4px;font-variant-numeric:tabular-nums}
.pc-weight{--c:var(--c-weight)}.pc-sleep{--c:var(--c-sleep)}.pc-meals{--c:var(--c-meals)}.pc-supps{--c:var(--c-supps)}
.pc-neutral{box-shadow:none}.pc-neutral .pc-tile{background:var(--dsoft)}.pc-neutral .pc-tile .ic{stroke:var(--dmuted)}.pc-neutral .pc-tick{background:var(--chalk)}
.ph-nav{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));padding:6px 8px 14px;background:var(--navy);border-top:1px solid var(--dline)}
.pn{display:flex;flex-direction:column;align-items:center;gap:2px;padding:6px 0;border-radius:9px;color:var(--dmuted);font-size:9px;font-weight:700}
.pn .ic{width:18px;height:18px;stroke:currentColor}
.pn-on{background:#35271e;color:#ff9565}
.ic{fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}

/* strips */
.strips{overflow:hidden;padding:20px 0}
.strip{transform:rotate(-2deg);margin:0 -60px;overflow:hidden}
.strip-o{background:var(--orange);color:var(--charcoal);padding:14px 0;box-shadow:0 12px 40px #ff5a1f40}
.strip-d{background:var(--charcoal);color:var(--chalk);padding:12px 0}
.track{display:flex;width:max-content;animation:marquee 36s linear infinite}
.track-r{animation:marquee-r 42s linear infinite}
.s-big{display:inline-flex;align-items:center;gap:24px;padding-right:24px;font-family:var(--display);font-weight:900;font-size:46px;line-height:1.05;white-space:nowrap}
.plates{width:22px;height:30px;fill:currentColor}
.s-sm{display:inline-flex;align-items:center;gap:14px;padding-right:30px;font-size:18px;font-weight:700;white-space:nowrap}
.dot{display:block;width:12px;height:12px;border-radius:50%;background:var(--c-neutral);flex:none}
.dot-workout{background:var(--c-workout)}.dot-chalk{background:var(--chalk)}.dot-meals{background:var(--c-meals)}.dot-weight{background:var(--c-weight)}.dot-sleep{background:var(--c-sleep)}.dot-supps{background:var(--c-supps)}

/* trust */
.trust{display:flex;flex-wrap:wrap;gap:14px 28px;align-items:center;justify-content:center;padding-top:56px;padding-bottom:40px}
.t-app{font-family:var(--display);font-weight:800;font-size:32px}

/* section heads */
.h2{font-family:var(--display);font-weight:900;font-size:clamp(46px,6vw,86px);line-height:.88}
.sec-head{display:flex;flex-wrap:wrap;gap:24px;justify-content:space-between;align-items:flex-end}
.sec-head .h2{max-width:720px}
.sec-head p{max-width:400px;font-size:17px;color:var(--ink-2)}

/* why */
.why{padding-top:60px;padding-bottom:110px}
.why-in{border-radius:20px;background:var(--charcoal);color:var(--chalk);padding:clamp(28px,5vw,64px);display:flex;flex-wrap:wrap;gap:48px;align-items:center}
.why-copy{flex:1 1 380px;min-width:0;display:flex;flex-direction:column;gap:18px}
.why-copy p{font-size:17px;color:var(--dtext)}
.why-art{flex:1 1 520px;min-width:0;display:grid;grid-template-columns:minmax(0,1.1fr) 90px minmax(0,1fr);align-items:center}
.sc{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.sc-row{display:flex;gap:10px;align-items:center;min-height:52px;padding:0 14px;border-radius:9px;background:var(--navy);border:1px solid var(--dline)}
.sc-row .dot{width:10px;height:10px}
.sc-t{font-size:15px;font-weight:700}
.sc-w{margin-left:auto;font-size:13px;color:var(--dmuted);text-align:right}
.flow{width:90px;height:300px}
.flow path{fill:none;stroke:var(--orange);stroke-width:2.5;stroke-dasharray:6 8;animation:flow 1.2s linear infinite}
.one{padding:24px;border-radius:16px;background:var(--orange);color:var(--charcoal);display:flex;flex-direction:column;gap:10px;box-shadow:0 0 60px #ff5a1f55;font-size:14px;font-weight:700}
.one-t{font-family:var(--display);font-weight:800;font-size:36px;line-height:.95}

/* loop */
.loop{padding-bottom:120px;display:flex;flex-direction:column;gap:40px}
.lps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:16px}
.lp{display:flex;flex-direction:column;gap:12px;padding:28px 28px 32px;border-radius:16px;min-height:260px;color:var(--charcoal);font-size:16px;font-weight:600}
.lp-1{background:var(--orange);transform:rotate(-1.2deg)}
.lp-2{background:var(--c-sleep);transform:rotate(.8deg)}
.lp-3{background:var(--c-meals);transform:rotate(-.6deg)}
.lp-n{font-family:var(--display);font-weight:900;font-size:26px}
.lp-t{font-family:var(--display);font-weight:900;font-size:64px;line-height:.85}

/* tracks */
.dark{background:var(--charcoal);color:var(--chalk)}
.tracks{padding-top:110px;padding-bottom:110px;display:flex;flex-wrap:wrap;gap:40px;align-items:flex-start}
.tracks-copy{flex:1 1 360px;min-width:0;display:flex;flex-direction:column;gap:20px}
.tracks-copy>p{font-size:17px;color:var(--dtext)}
.live{padding:20px;border-radius:16px;background:var(--navy);border:1px solid var(--dline);display:flex;flex-direction:column;gap:12px}
.live-head{display:flex;justify-content:space-between;align-items:center}
.live-name{font-family:var(--display);font-weight:700;font-size:30px;line-height:1}
.live-tag{display:inline-flex;gap:8px;align-items:center;font-size:13px;font-weight:700;color:#ff9565}
.live-dot{width:8px;height:8px;border-radius:50%;background:var(--orange);animation:pulse 1.8s ease-out infinite}
.sets{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.set{display:flex;gap:14px;align-items:center;min-height:44px;padding:0 14px;border-radius:9px;font-size:15px;font-variant-numeric:tabular-nums;color:#7e8489;border:1.5px solid transparent}
.set.is-next{border-color:#52616b;border-style:dashed;color:var(--chalk)}
.set.is-done{background:var(--dsoft);color:var(--chalk)}
.set.is-pb{background:var(--orange);color:var(--charcoal)}
.set.just{animation:flash .9s ease-out}
.set-n{font-weight:800}
.set-m{margin-left:auto;font-weight:800}
.live-stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.live-stats div{padding:12px 14px;border-radius:9px;background:var(--dsoft)}
.live-stats span{display:block;font-size:12px;font-weight:700;color:var(--dmuted)}
.live-stats b{font-family:var(--display);font-weight:800;font-size:34px;font-variant-numeric:tabular-nums}
.mks{flex:999 1 560px;min-width:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px}
.mk{--c:var(--c-neutral);padding:20px;border-radius:13px;background:var(--navy);border:1px solid var(--dline);display:flex;flex-direction:column;gap:10px;box-shadow:0 0 28px color-mix(in srgb,var(--c) 15%,transparent)}
.mk-workout{--c:var(--c-workout)}.mk-chalk{--c:var(--chalk)}.mk-meals{--c:var(--c-meals)}.mk-weight{--c:var(--c-weight)}.mk-sleep{--c:var(--c-sleep)}.mk-supps{--c:var(--c-supps)}
.mk-neutral{box-shadow:none}
.mk-top{display:flex;gap:12px;align-items:center}
.mk-top h3{font-size:15px;font-weight:800}
.mk-tile{width:38px;height:38px;border-radius:9px;display:flex;align-items:center;justify-content:center;background:color-mix(in srgb,var(--c) 18%,transparent)}
.mk-neutral .mk-tile{background:var(--dsoft)}
.mk-tile .ic{width:20px;height:20px;stroke:var(--c)}
.mk-v{font-family:var(--display);font-weight:800;font-size:40px;line-height:1;font-variant-numeric:tabular-nums}
.mk-spark{width:100%;height:44px}
.mk-spark polyline{fill:none;stroke:var(--c);stroke-width:3;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}
.mk-cap{font-size:13px;color:var(--dmuted)}
.draw{stroke-dasharray:1400;animation:draw 8s ease-in-out infinite}
.d1{animation-delay:.3s}.d2{animation-delay:.6s}.d3{animation-delay:.9s}.d4{animation-delay:1.2s}.d5{animation-delay:1.5s}.d6{animation-delay:1.8s}.d7{animation-delay:2.1s}.d8{animation-delay:2.4s}

/* compare */
.cmp{padding-top:110px;padding-bottom:110px;display:flex;flex-wrap:wrap;gap:48px;align-items:center}
.cmp-copy{flex:1 1 380px;min-width:0;display:flex;flex-direction:column;gap:18px}
.cmp-copy>p:not(.muted){font-size:17px;color:var(--ink-2)}
.cmp-card{flex:999 1 560px;min-width:0;margin:0;padding:26px;border-radius:16px;background:var(--panel);border:1px solid var(--line);box-shadow:0 30px 60px #171b1e12;display:flex;flex-direction:column;gap:14px}
.legend{display:flex;flex-wrap:wrap;gap:8px}
.legend span{display:inline-flex;gap:8px;align-items:center;padding:8px 14px;border-radius:999px;background:var(--soft);font-size:14px;font-weight:800}
.legend i{width:16px;height:4px;border-radius:2px}
.lg-vol{background:#e8571c}.lg-orm{background:var(--ink)}
.chart{width:100%;height:auto}
.chart .grid line{stroke:#ece9e2;stroke-width:1}
.chart .base{stroke:#b9b5ab;stroke-width:1.5}
.chart .ticks{fill:var(--muted);font-size:12px;font-family:var(--body)}
.chart polyline{fill:none;stroke-width:3.5;stroke-linecap:round;stroke-linejoin:round}
.ln-vol{stroke:#e8571c}.ln-orm{stroke:var(--ink);animation-delay:.4s}

/* faq */
.faq{background:var(--panel);border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:100px 0}
.faq .wrap-narrow{display:flex;flex-direction:column;gap:28px}
.qas{border-top:2px solid var(--ink)}
.qa{border-bottom:1px solid var(--line)}
.qa summary{list-style:none;cursor:pointer;display:flex;gap:16px;align-items:center;justify-content:space-between;min-height:64px;padding:8px 0;font-size:19px;font-weight:800}
.qa summary::-webkit-details-marker{display:none}
.plus{flex:none;width:34px;height:34px;border-radius:50%;background:var(--orange);position:relative;transition:transform .15s}
.plus::before,.plus::after{content:"";position:absolute;left:50%;top:50%;width:14px;height:2.5px;margin:-1.25px 0 0 -7px;background:var(--charcoal);border-radius:2px}
.plus::after{transform:rotate(90deg)}
.qa[open] .plus{transform:rotate(45deg)}
.qa p{margin:0 0 22px;max-width:680px;font-size:16px;line-height:1.6;color:var(--ink-2)}

/* end */
.end{position:relative;overflow:hidden;background:var(--orange);color:var(--charcoal)}
.end-sun{position:absolute;right:-140px;bottom:-260px;width:620px;height:620px;border-radius:50%;background:var(--c-sleep);box-shadow:0 0 140px #f2c447aa}
.end-in{position:relative;padding-top:110px;padding-bottom:110px;display:flex;flex-direction:column;gap:34px;align-items:flex-start}
.h-end{font-family:var(--display);font-weight:900;font-size:clamp(76px,14vw,220px);line-height:.8;letter-spacing:-2px}
.end-sub{font-family:var(--display);font-weight:800;font-size:clamp(32px,4vw,52px);line-height:1}
.end-p{max-width:560px;font-size:18px;font-weight:700}
.end a{color:var(--charcoal)}


/* buttons and register interest */
.btn-primary,.cta-sm{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 26px;border-radius:7px;background:linear-gradient(var(--orange-top),var(--orange));border:1px solid var(--orange-border);color:var(--charcoal);font-weight:800;font-size:17px;text-decoration:none;box-shadow:0 4px 0 #92320c,inset 0 1px 0 #ffffff30;transition:transform .15s}
.btn-primary:hover,.cta-sm:hover{color:var(--charcoal);transform:translateY(-1px)}
.btn-primary:active,.cta-sm:active{transform:translateY(2px);box-shadow:0 2px 0 #92320c}
.nav .cta-sm{min-height:44px;padding:0 16px;font-size:14px;color:var(--charcoal)}
.nav .cta-sm:hover{color:var(--charcoal)}
.reg{display:flex;flex-wrap:wrap;gap:32px;align-items:flex-start;width:100%}
.reg-copy{flex:1 1 320px;min-width:0;display:flex;flex-direction:column;gap:14px}
.reg-note{max-width:460px;font-size:15px;font-weight:600}
.reg-form{flex:1 1 380px;min-width:0;max-width:520px;background:var(--charcoal);color:var(--chalk);border-radius:16px;padding:clamp(20px,3vw,32px);display:flex;flex-direction:column;gap:16px;box-shadow:0 24px 50px #12141640}
.reg-h{font-family:var(--display);font-weight:800;font-size:34px;line-height:1}
.fld{display:flex;flex-direction:column;gap:6px;font-size:14px;font-weight:700}
.fld input{height:52px;padding:0 14px;border-radius:7px;border:1.5px solid #52616b;background:var(--navy);color:var(--chalk);font:500 16px var(--body)}
.fld input:focus-visible{outline:3px solid #ff9a70;outline-offset:2px}
.fld-set{border:0;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.fld-set legend{width:100%;margin-bottom:6px;font-size:14px;font-weight:700;padding:0}
.opt{position:relative;display:inline-flex}
.opt input{position:absolute;opacity:0;width:1px;height:1px}
.opt span{display:inline-flex;align-items:center;min-height:44px;padding:0 18px;border-radius:999px;border:1.5px solid #52616b;font-weight:700;font-size:15px;cursor:pointer}
.opt input:checked+span{background:#35271e;border-color:#ff9565;color:#ff9565}
.opt input:focus-visible+span{outline:3px solid #ff9a70;outline-offset:2px}
.chk{display:flex;gap:12px;align-items:flex-start;font-size:14px;line-height:1.45;color:var(--dtext)}
.chk input{flex:none;width:22px;height:22px;margin:1px 0 0;accent-color:var(--orange)}
.chk a{color:var(--chalk)}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.btn-dark{min-height:54px;border-radius:7px;border:1px solid var(--orange-border);background:linear-gradient(var(--orange-top),var(--orange));color:var(--charcoal);font:800 17px var(--body);cursor:pointer;box-shadow:0 4px 0 #92320c}
.btn-dark:active{transform:translateY(2px);box-shadow:0 2px 0 #92320c}
.end .reg-form a{color:var(--chalk)}

/* footer */
.foot{background:var(--charcoal);color:var(--dmuted)}
.foot-in{padding-top:36px;padding-bottom:44px;display:flex;flex-wrap:wrap;gap:18px 28px;align-items:center;justify-content:space-between;font-size:14px}
.foot-logo{height:34px;width:auto}
.foot-nav{display:flex;flex-wrap:wrap;gap:22px}
.foot-nav a{color:var(--chalk)}
.foot-nav a:hover{color:#ff9565}
.fine{flex-basis:100%;font-size:12px;line-height:1.5;max-width:900px}

/* document pages */
.doc{padding-top:72px;padding-bottom:110px;display:flex;flex-direction:column;gap:18px}
.doc h2{font-size:24px;font-weight:800;margin-top:22px}
.doc p,.doc li{font-size:17px;line-height:1.6;color:var(--ink-2);max-width:68ch}
.doc ul{margin:0;padding-left:22px;display:flex;flex-direction:column;gap:6px}
.nf{min-height:50vh}
.link-big{font-weight:800;font-size:18px}


/* app demo: cards fill with colour as they are logged */
.pc,.ph-work{transition:box-shadow .45s ease,transform .18s ease,background-color .45s ease}
.pc-tile{transition:background-color .45s ease}
.pc-tile .ic{transition:stroke .45s ease}
.pc-tick,.ph-wtick{transition:transform .4s cubic-bezier(.2,.9,.25,1.5)}
.pc-empty{display:none;font-size:13px;font-weight:600;color:var(--dmuted);line-height:22px}
.pc:not(.is-logged){box-shadow:none}
.pc:not(.is-logged) .pc-tile{background:var(--dsoft)}
.pc:not(.is-logged) .pc-tile .ic{stroke:var(--dmuted)}
.pc:not(.is-logged) .pc-tick,.ph-work:not(.is-logged) .ph-wtick{transform:scale(0)}
.pc:not(.is-logged) .pc-v{display:none}
.pc:not(.is-logged) .pc-empty{display:block}
.ph-work:not(.is-logged){box-shadow:none}
.pc.pressed,.ph-work.pressed{transform:scale(.95)}
.pd-dot{transition:background-color .4s}
#pd-today:not(.done) .pd-dot{background:var(--dline)}
#pd-today.done .pd-dot{background:#ea6226}
.tap{position:absolute;left:150px;top:300px;width:30px;height:30px;margin:-15px 0 0 -15px;border-radius:50%;background:#f2efe844;border:2px solid #f2efe8cc;box-shadow:0 0 0 0 #f2efe866;opacity:0;pointer-events:none;z-index:5;transition:left .55s cubic-bezier(.45,0,.2,1),top .55s cubic-bezier(.45,0,.2,1),opacity .3s}
.tap.on{opacity:1}
.tap.hit{animation:tap .45s ease-out}
@keyframes tap{0%{transform:scale(1);box-shadow:0 0 0 0 #f2efe888}40%{transform:scale(.75)}100%{transform:scale(1);box-shadow:0 0 0 16px #f2efe800}}
@keyframes glow{from{box-shadow:0 0 90px #f2c44788}to{box-shadow:0 0 170px #f2c447cc,0 0 60px #ffb34066}}
@keyframes thaw{from{opacity:1}to{opacity:0}}

/* pause control (WCAG 2.2.2) */
.motion-btn{position:fixed;right:16px;bottom:16px;z-index:30;min-height:44px;padding:0 16px;border-radius:999px;border:1.5px solid #f2efe855;background:var(--charcoal);color:var(--chalk);font:700 13px/1 var(--body);cursor:pointer;box-shadow:0 8px 24px #12141640}
.motion-btn:hover{background:#273139}
html.paused *,html.paused *::before,html.paused *::after{animation-play-state:paused!important}
/* one-shot intro animations jump to their end state when paused, so nothing is left hidden */
html.paused .rise,html.paused .lg,html.paused .lg-word,html.paused .sun{animation:none!important}
html.paused .hero-band::before,html.paused .hero-band::after{animation:none!important;opacity:0}
html.paused .tap{opacity:0}

/* motion */
@keyframes in-l{from{transform:translateX(-340px);opacity:0}to{transform:none;opacity:1}}
@keyframes in-r{from{transform:translateX(340px);opacity:0}to{transform:none;opacity:1}}
@keyframes drop{from{transform:translateY(-180px);opacity:0}to{transform:none;opacity:1}}
@keyframes fade{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
@keyframes rep{0%,78%,100%{transform:translateY(0)}86%{transform:translateY(-6px)}92%{transform:translateY(1px)}}
@keyframes sunrise{from{transform:translateY(160px)}to{transform:none}}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
@keyframes marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@keyframes marquee-r{from{transform:translateX(-50%)}to{transform:translateX(0)}}
@keyframes flow{to{stroke-dashoffset:-40}}
@keyframes draw{0%{stroke-dashoffset:1400}45%{stroke-dashoffset:0}90%{stroke-dashoffset:0;opacity:1}100%{stroke-dashoffset:0;opacity:0}}
@keyframes flash{0%{transform:scale(1.04);box-shadow:0 0 0 3px var(--orange)}100%{transform:none;box-shadow:none}}
@keyframes sheen{0%{background-position:0% 50%}100%{background-position:220% 50%}}
@keyframes pulse{0%{box-shadow:0 0 0 0 #ff5a1f88}70%{box-shadow:0 0 0 10px #ff5a1f00}100%{box-shadow:0 0 0 0 #ff5a1f00}}

@media (max-width:700px){
  .hero{padding-top:36px;padding-bottom:40px}
  .hero-art{height:700px;flex-basis:100%}
  .sun{width:440px;height:440px;margin:-220px 0 0 -220px}
  .rays{width:440px;height:440px}
  .sun-disc{inset:55px}
  .sun{top:58%}
  .badge-teal{top:40px;right:0}
  .badge-pink{bottom:10px;left:0}
  .why-art{grid-template-columns:minmax(0,1fr);gap:14px}
  .flow{display:none}
  .lp{transform:none}
  .logo{height:44px}
  .nav{gap:16px}
}
@media (max-width:420px){.nav a{display:none}.nav a.cta-sm{display:inline-flex}.s-big{font-size:36px}.count-n b{font-size:30px}}
/* Reduced motion: a calm version, not a frozen one. Slow strips, no spinning, bouncing or shimmer. */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .track{animation-duration:140s}.track-r{animation-duration:170s}
  .rays,.bob,.brand .logo,.h-summer,.flow path,.soon::before,.live-dot,.sun-disc,.lg,.lg-word,.rise,.sun{animation:none}
  .draw{animation:none;stroke-dasharray:none}
  .sun-lift{transform:none}
  .hero-band::before,.hero-band::after{animation-duration:1.2s}
}