/* The home page hero's look (docs/landing-hero/README.md). Every rule sits under #tia-hero, so nothing leaks into or out
 * of the LearnWorlds page. The pasted block links this file at its top, so the hero is styled from the first paint and
 * nothing jumps when landing-hero.js arrives (Geoff, 2026-10-26: PageSpeed); an older paste without the link gets it
 * from the script. Served no-cache from /hero, so a change ships on the next deploy with no re-paste. */
#tia-hero{position:relative;overflow:hidden;background:#fff;color:#0d0d2b;font-family:Raleway,'Helvetica Neue',Arial,sans-serif;font-weight:300;line-height:1.55;-webkit-font-smoothing:antialiased;margin:0;padding:0;text-align:left}
#tia-hero *,#tia-hero *::before,#tia-hero *::after{box-sizing:border-box}
#tia-hero .tia-hero__body{position:relative;max-width:1280px;margin:0 auto;display:grid;grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);align-items:center;gap:40px;min-height:640px;padding:56px 32px 60px}
#tia-hero .tia-hero__copy{position:relative;z-index:4;display:grid;gap:22px;max-width:550px;min-width:0}
#tia-hero .tia-hero__eyebrow{margin:0;display:flex;align-items:center;gap:10px;font-family:inherit;font-size:12.5px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:#000064}
#tia-hero .tia-hero__eyebrow::before{content:'';width:8px;height:8px;border-radius:50%;background:#e3232c;flex:none}
#tia-hero .tia-hero__headline{margin:0;padding:0;font-family:Poppins,'Helvetica Neue',Arial,sans-serif;font-weight:300;font-size:clamp(40px,5vw,68px);line-height:1.08;letter-spacing:-.05em;color:#000064;text-transform:none;text-wrap:balance}
#tia-hero .tia-hero__headline strong{font-weight:700;letter-spacing:inherit;color:inherit}
#tia-hero .tia-hero__headline .tia-w{display:inline-block;white-space:pre;transition:transform .6s cubic-bezier(.2,.8,.2,1),opacity .45s ease;will-change:transform,opacity}
#tia-hero .tia-hero__headline .tia-w.is-up{opacity:0;transform:translateY(-.35em)}
#tia-hero .tia-hero__headline .tia-w.is-down{opacity:0;transform:translateY(.45em);transition:none}
#tia-hero .tia-hero__lede{margin:0;font-family:inherit;font-size:19px;font-weight:400;line-height:1.55;color:#5b5b78;max-width:44ch;transition:opacity .45s ease,transform .6s cubic-bezier(.2,.8,.2,1)}
#tia-hero .tia-hero__lede.is-up{opacity:0;transform:translateY(-.3em)}
#tia-hero .tia-hero__lede.is-down{opacity:0;transform:translateY(.4em);transition:none}
#tia-hero .tia-hero__cta{display:flex;flex-wrap:wrap;align-items:center;gap:12px 20px;margin:0}
/* The trial button is the brand's call-to-action blue, #0224FF, as the emails' buttons (Geoff, 2026-10-20; emailKit.ts).
 * LearnWorlds colours links in its own theme (Geoff, 2026-10-20: the button's words came out blue on navy), and a
 * page rule can carry !important or more ids than ours, so the button's white is forced in every link state. */
#tia-hero .tia-hero__btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;background:#0224FF;color:#fff;text-decoration:none;font-family:inherit;font-weight:500;font-size:17px;line-height:1.2;padding:16px 28px;border-radius:10px;border:0;white-space:nowrap;transition:background-color .2s ease,transform .2s ease}
#tia-hero .tia-hero__btn:hover{background:#021ED6;transform:translateY(-1px)}
#tia-hero a.tia-hero__btn,#tia-hero a.tia-hero__btn:link,#tia-hero a.tia-hero__btn:visited,#tia-hero a.tia-hero__btn:hover,#tia-hero a.tia-hero__btn:focus,#tia-hero a.tia-hero__btn:active{color:#fff!important;-webkit-text-fill-color:#fff!important;background-color:#0224FF!important;text-decoration:none!important}
#tia-hero a.tia-hero__btn:hover{background-color:#021ED6!important}
#tia-hero a.tia-hero__btn svg{color:#fff!important;stroke:#fff!important}
#tia-hero .tia-hero__btn:focus-visible{outline:2px solid #0224FF;outline-offset:3px}
#tia-hero .tia-hero__btn svg{width:18px;height:18px;transition:transform .2s ease}
#tia-hero .tia-hero__btn:hover svg{transform:translateX(3px)}
#tia-hero .tia-hero__reassure{display:flex;align-items:center;gap:8px;margin:0;font-family:inherit;font-size:14px;font-weight:400;color:#5b5b78}
#tia-hero .tia-hero__reassure svg{width:16px;height:16px;flex:none;color:#000064}
#tia-hero .tia-hero__proof{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 22px;margin:0;padding:18px 0 0;border-top:1px solid #e4e4ef;list-style:none;font-family:inherit;font-size:14px;font-weight:400;line-height:1.45;color:#5b5b78;background:rgba(255,255,255,.8)}
#tia-hero .tia-hero__proof li{margin:0;padding:0;list-style:none}
#tia-hero .tia-hero__proof li::before,#tia-hero .tia-hero__proof li::marker{content:none}
#tia-hero .tia-hero__proof b{font-weight:700;color:#000064;font-variant-numeric:tabular-nums}
#tia-hero .tia-hero__chart{position:absolute;left:34%;right:0;top:0;bottom:0;z-index:1;pointer-events:none}
#tia-hero .tia-hero__chart canvas{position:absolute;inset:0;width:100%;height:100%;display:block;opacity:.5}
#tia-hero .tia-hero__chart::before{content:'';position:absolute;inset:0;z-index:2;background:linear-gradient(90deg,#fff 0%,#fff 10%,rgba(255,255,255,0) 42%)}
#tia-hero .tia-hero__media{position:relative;z-index:4;min-width:0;perspective:1600px;display:flex;justify-content:flex-end;align-self:end}
#tia-hero .tia-hero__reel{position:relative;width:min(100%,410px);aspect-ratio:1/1;max-width:100%;border-radius:20px;overflow:hidden;background:#fff;outline:1px solid transparent;backface-visibility:hidden;-webkit-backface-visibility:hidden;isolation:isolate;transform:rotateY(-10deg) rotateX(3deg);transform-origin:60% 50%;transition:transform .6s cubic-bezier(.2,.7,.2,1);box-shadow:0 0 0 1px rgba(0,0,100,.14),0 60px 90px -60px rgba(0,0,100,.6)}
#tia-hero .tia-hero__reel video,#tia-hero .tia-hero__reel img{position:absolute;top:-1px;left:-1px;width:calc(100% + 2px);height:calc(100% + 2px);max-width:none;object-fit:cover;display:block;border-radius:inherit;margin:0}
#tia-hero .tia-hero__controls{position:absolute;left:14px;right:14px;bottom:14px;display:flex;justify-content:space-between;align-items:center;gap:10px}
#tia-hero .tia-hero__pill{display:inline-flex;align-items:center;gap:8px;border:0;margin:0;border-radius:999px;background:rgba(255,255,255,.95);color:#000064;font-family:inherit;font-weight:600;font-size:13.5px;line-height:1.2;padding:9px 15px 9px 11px;cursor:pointer;box-shadow:0 0 0 1px rgba(0,0,100,.14)}
#tia-hero .tia-hero__pill,#tia-hero .tia-hero__pill:hover,#tia-hero .tia-hero__pill:focus{color:#000064!important;-webkit-text-fill-color:#000064!important;background-color:rgba(255,255,255,.95)!important}
#tia-hero .tia-hero__pill:focus-visible{outline:2px solid #000064;outline-offset:2px}
#tia-hero .tia-hero__pill svg{width:18px;height:18px}
#tia-hero .tia-hero__round{width:38px;height:38px;padding:0;justify-content:center}
#tia-hero .tia-car{--card:350px;--fanx:118px;--fany:-44px;--fanz:-230px;position:relative;width:100%;max-width:600px;margin-left:auto;-webkit-user-select:none;user-select:none;touch-action:pan-y;outline:none}
#tia-hero .tia-car__stage{position:relative;height:var(--card);margin-top:70px;perspective:1300px;perspective-origin:30% 40%;transform-style:preserve-3d;cursor:grab}
#tia-hero .tia-car__stage.is-dragging{cursor:grabbing}
#tia-hero .tia-car__card{position:absolute;left:calc(50% - 110px);top:0;width:var(--card);height:var(--card);margin-left:calc(var(--card) / -2);border-radius:22px;overflow:hidden;background:#fff;outline:1px solid transparent;backface-visibility:hidden;-webkit-backface-visibility:hidden;isolation:isolate;box-shadow:0 0 0 1px rgba(0,0,100,.14),0 50px 80px -50px rgba(0,0,100,.55);will-change:transform,opacity}
#tia-hero .tia-car__card video,#tia-hero .tia-car__card img{position:absolute;top:-1px;left:-1px;width:calc(100% + 2px);height:calc(100% + 2px);max-width:none;object-fit:cover;display:block;border-radius:inherit;margin:0;pointer-events:none}
#tia-hero .tia-car__card .tia-hero__controls{opacity:0;visibility:hidden;transition:opacity .3s ease}
#tia-hero .tia-car__card.is-active .tia-hero__controls{opacity:1;visibility:visible}
#tia-hero .tia-car__card:not(.is-active){cursor:pointer}
#tia-hero .tia-car__meta{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:26px 0 0 calc(50% - 110px - var(--card) / 2);width:var(--card);max-width:100%}
#tia-hero .tia-car__title{margin:0;font-family:inherit;font-size:16px;font-weight:600;line-height:1.3;color:#000064}
#tia-hero .tia-car__sub{margin:2px 0 0;font-family:inherit;font-size:14px;font-weight:400;line-height:1.4;color:#5b5b78}
#tia-hero .tia-car__nav{display:flex;align-items:center;gap:10px;flex:none}
#tia-hero .tia-car__arrow{width:40px;height:40px;border-radius:50%;border:0;margin:0;padding:0;display:grid;place-items:center;background:#f2f2f7!important;color:#000064!important;cursor:pointer;transition:background-color .2s ease}
#tia-hero .tia-car__arrow:hover{background:#e6e6f0!important}
#tia-hero .tia-car__arrow:focus-visible,#tia-hero .tia-car__dot:focus-visible{outline:2px solid #000064;outline-offset:2px}
#tia-hero .tia-car__arrow svg{width:18px;height:18px}
#tia-hero .tia-car__dots{display:flex;gap:7px}
#tia-hero .tia-car__dot{width:7px;height:7px;border-radius:999px;border:0;margin:0;padding:0;background:#c9c9da!important;cursor:pointer;transition:width .35s cubic-bezier(.2,.8,.2,1),background-color .35s ease}
#tia-hero .tia-car__dot[aria-current=true]{width:22px;background:#000064!important}
/* The strip of where our members work, at the foot of the hero (Geoff, 2026-10-20). Logos in navy, faded; they glide
 * sideways, with the ends faded out. */
#tia-hero .tia-hero__logos{position:relative;z-index:4;max-width:1280px;margin:0 auto;padding:0 32px 34px}
#tia-hero .tia-logos__in{display:flex;align-items:center;gap:28px;border-top:1px solid #e4e4ef;padding-top:22px}
#tia-hero .tia-logos__cap{flex:none;margin:0;font-family:inherit;font-size:12.5px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:#5b5b78;white-space:nowrap}
#tia-hero .tia-logos{position:relative;flex:1;min-width:0;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 9%,#000 91%,transparent);mask-image:linear-gradient(90deg,transparent,#000 9%,#000 91%,transparent)}
#tia-hero .tia-logos__track{display:flex;align-items:center;gap:56px;width:max-content;margin:0;padding:6px 28px;list-style:none;will-change:transform}
#tia-hero .tia-logos__track li{flex:none;margin:0;padding:0;display:flex;align-items:center;height:40px}
#tia-hero .tia-logos__track img{display:block;width:auto;height:calc(var(--h) * var(--k, 1) * 1px);max-width:none;opacity:.5;transition:opacity .25s ease}
#tia-hero .tia-logos__track li:hover img{opacity:.85}
#tia-hero .tia-logos.is-static{-webkit-mask-image:none;mask-image:none}
#tia-hero .tia-logos.is-static .tia-logos__track{width:auto;flex-wrap:wrap;justify-content:center;gap:18px 40px;padding:6px 0}
@media (max-width:760px){
#tia-hero .tia-hero__body{grid-template-columns:1fr;min-height:0;gap:16px;padding:26px 16px 36px}
#tia-hero .tia-hero__copy{display:contents}
#tia-hero .tia-hero__copy>*{position:relative;z-index:4}
#tia-hero .tia-hero__headline{font-size:39px}
#tia-hero .tia-hero__lede{font-size:16.5px}
#tia-hero .tia-hero__cta{gap:10px}
#tia-hero .tia-hero__btn{width:100%;font-size:17px}
#tia-hero .tia-hero__reassure{width:100%;justify-content:center}
#tia-hero .tia-hero__media{order:1;align-self:auto;justify-content:center;margin-top:10px}
#tia-hero .tia-hero__proof{order:2;gap:6px 14px;font-size:13px;margin-top:10px}
#tia-hero .tia-hero__chart{left:0;top:auto;bottom:120px;height:440px}
#tia-hero .tia-hero__chart::before{background:linear-gradient(180deg,#fff 0%,rgba(255,255,255,0) 30%)}
#tia-hero .tia-hero__reel{width:100%;transform:rotateX(5deg);transform-origin:50% 100%}
#tia-hero .tia-car{--card:min(64vw,290px);--fanx:44px;--fany:-24px;--fanz:-170px;margin:0 -16px;width:calc(100% + 32px);max-width:none;overflow:hidden;padding-bottom:4px}
#tia-hero .tia-car__stage{margin-top:46px}
#tia-hero .tia-car__card{left:calc(50% - 40px)}
#tia-hero .tia-car__meta{padding:0 16px;width:auto;max-width:none;margin:22px 0 0}
#tia-hero .tia-hero__logos{padding:0 16px 26px}
#tia-hero .tia-logos__in{flex-direction:column;align-items:stretch;gap:12px;padding-top:18px}
#tia-hero .tia-logos__cap{text-align:center;font-size:11.5px}
#tia-hero .tia-logos{margin:0 -16px;--k:.72}
#tia-hero .tia-logos__track{gap:40px}
}
@media (prefers-reduced-motion:reduce){#tia-hero .tia-hero__btn,#tia-hero .tia-hero__btn svg,#tia-hero .tia-hero__reel,#tia-hero .tia-logos__track img{transition:none}}
/* The block keeps the hero hidden until this file has arrived (with a 3s safety net), so a page LearnWorlds paints
   before this file lands never shows an unstyled hero that then jumps (Geoff, 2026-10-26: one load in four on
   /start-trial measured 0.4 to 0.9) */
#tia-hero{visibility:visible!important;animation:none!important}
/* The one rule outside #tia-hero: its LearnWorlds section's top and foot padding go (Geoff, 2026-10-23), here so the
   hero starts where it ends up instead of moving up when the script takes the padding away (it still does, for browsers
   without :has) */
.learnworlds-section:has(> #tia-hero),.learnworlds-section:has(#tia-hero){padding-top:0!important;padding-bottom:0!important}
/* Until the script has built the hero, hold the room its videos and its logo strip will take, so nothing below moves
   when they arrive (Geoff, 2026-10-26: PageSpeed measured the page jumping). Measured at 360 to 1440px wide. */
#tia-hero:not([data-ready]){padding-bottom:109px}
#tia-hero:not([data-ready]) .tia-hero__media{min-height:529px}
/* The front video's still sits in the block itself, where the deck will put its front card, so the page's largest
   picture paints with the page instead of waiting for the script (Geoff, 2026-10-26: PageSpeed); the deck replaces it */
#tia-hero .tia-hero__ph{position:absolute;top:70px;right:calc(min(100%,600px) / 2 - 65px);width:350px;height:350px;max-width:none;margin:0;object-fit:cover;border-radius:22px;box-shadow:0 0 0 1px rgba(0,0,100,.14),0 50px 80px -50px rgba(0,0,100,.55)}
@media (max-width:760px){#tia-hero:not([data-ready]){padding-bottom:127px}#tia-hero:not([data-ready]) .tia-hero__media{min-height:calc(150px + min(64vw,290px))}#tia-hero .tia-hero__ph{top:46px;right:auto;left:calc(50% - 40px - min(64vw,290px) / 2);width:min(64vw,290px);height:min(64vw,290px)}}