/* Three roles: Promo for events, EDU for robotics, Tutor for school practice. */
.page--chatty .phero__shot{aspect-ratio:941/1672;width:100%;max-width:min(350px,calc((100svh - 156px) * 941 / 1672));max-height:none}
.page--chatty .shot img{object-fit:contain;object-position:center;background:var(--paper)}
.page--chatty .phero__actions .btn{animation:none!important}
.page--chatty .versions{gap:24px}
.page--chatty .version{display:grid;grid-template-columns:minmax(0,.75fr) minmax(0,1fr);gap:10px 20px;align-content:center;padding:20px}
.page--chatty .version__shot{grid-column:1;grid-row:1/6;width:100%;height:auto!important;aspect-ratio:3/4;margin:0;align-self:center}
.page--chatty .version>:not(.version__shot){grid-column:2;margin:0}
.page--chatty .version h3{font-size:22px;line-height:1.2}
.page--chatty .version__list{padding-left:16px;font-size:13px;line-height:1.55}
.page--chatty .version .btn{justify-self:start;font-size:12px;padding:12px}
.page--chatty .why__band{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);height:auto;aspect-ratio:auto;align-items:center;background:none;gap:28px}
.page--chatty .why__band>img{position:static;height:auto;aspect-ratio:1280/960;width:100%}
.page--chatty .why__band .who__over{position:static;inset:auto;background:none;padding:20px;clip-path:none}
.page--chatty .why__band .banner__title{color:var(--heading-blue);text-shadow:none}
.page--chatty .why__band .banner__lede{color:var(--petrol)}
.page--chatty .why__band::before,.page--chatty .why__band::after{width:calc((100% - 28px) * 1.1 / 2.1);height:100%}
.page--chatty .why__band figcaption{display:none}
.page--chatty .tools__grid .shot{height:auto;aspect-ratio:1400/1040}
.page--chatty .tools__grid .shot img{padding:3px}
.page--chatty .tools__reel{aspect-ratio:941/1672}
.page--chatty .tools__reel>img{display:block;width:100%;height:100%;object-fit:contain}
.page--chatty .tutor-intro>.banner{max-width:800px;margin-bottom:30px}
.page--chatty .tutor-intro__body{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:44px;align-items:center}
.page--chatty .tutor-cycle{--pxbg:var(--mint-soft);padding:26px 28px}
.page--chatty .tutor-cycle .eyebrow{margin:0 0 10px;color:var(--green-ink)}
.page--chatty .tutor-cycle h3{font-size:22px;line-height:1.3;margin:0;max-width:28ch}
.page--chatty .tutor-cycle__track{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;list-style:none;margin:26px 0 22px;padding:0}
.page--chatty .tutor-cycle__track li{position:relative;text-align:center;min-width:0}
.page--chatty .tutor-cycle__track li+li::before{content:'→';position:absolute;left:-22px;top:30px;color:var(--green-ink);font-size:20px}
.page--chatty .tutor-cycle__track svg{display:block;width:100%;max-width:100px;height:auto;margin:0 auto 12px}
.page--chatty .tutor-cycle__track b{font-size:12px;line-height:1.4;display:block}
.page--chatty .tutor-cycle__note{margin:0;padding-top:16px;border-top:2px solid var(--mint-line);font-size:13px;line-height:1.6}
.page--chatty .tutor-benefits{list-style:none;margin:0 0 24px;padding:0;display:grid;gap:24px}
.page--chatty .tutor-benefits li{display:grid;grid-template-columns:56px minmax(0,1fr);gap:16px}
.page--chatty .chatty-icon{display:block;width:56px;height:56px;background-image:url('/assets/img/icons/chatty-retro-generated-alpha-v3.png');background-size:300% 300%;background-repeat:no-repeat;background-color:transparent;image-rendering:pixelated;mix-blend-mode:normal}
.page--chatty .chatty-icon--1{background-position:0 0}
.page--chatty .chatty-icon--2{background-position:50% 0}
.page--chatty .chatty-icon--3{background-position:100% 0}
.page--chatty .chatty-icon--4{background-position:0 50%}
.page--chatty .chatty-icon--5{background-position:50% 50%}
.page--chatty .tutor-cycle__track .chatty-icon{width:80px;height:auto;aspect-ratio:1;max-width:100%;margin:0 auto 8px}
.page--chatty .tutor-benefits img{image-rendering:pixelated}
.page--chatty .tutor-benefits h3{margin:0 0 8px;font-size:20px;line-height:1.3}
.page--chatty .tutor-benefits p{margin:0;font-size:14px;line-height:1.65}
.page--chatty .tutor-intro__pilot{display:flex;gap:20px;align-items:baseline;margin:28px 0 0;padding-top:16px;border-top:2px solid var(--outline-blue);font-size:12px;line-height:1.6}
.page--chatty .tutor-intro__pilot b{color:var(--green-ink)}
.page--chatty .tutor-intro__photo{margin:0;aspect-ratio:4/3;align-self:center}
.page--chatty .tutor-intro__photo>img{display:block;width:100%;height:100%;object-fit:contain}
.page--chatty .tutor-cycle.tutor-cycle--compact{padding:0 0 16px;margin-bottom:20px;border-bottom:2px solid var(--mint-line)}
.page--chatty .tutor-cycle--compact .tutor-cycle__track{margin:0}
.page--chatty .tutor-cycle--compact .tutor-cycle__track svg{max-width:56px;margin-bottom:8px}
.page--chatty .tutor-cycle--compact .tutor-cycle__track li+li::before{top:14px}
.page--chatty .tutor-intro__details .tutor-benefits{gap:18px;margin-bottom:20px}
.page--chatty .tutor-intro__details .tutor-benefits p{font-size:13px;line-height:1.55}
@media(max-width:800px){
 .page--chatty .tutor-intro__body{grid-template-columns:1fr;gap:28px}
 .page--chatty .tutor-cycle{padding:22px}
 .page--chatty .tutor-intro__pilot{display:block}
 .page--chatty .tutor-intro__pilot b{display:block;margin-bottom:8px}
}
.page--chatty .plans__shot{aspect-ratio:3/4;height:auto!important;max-height:calc(100svh - 180px)}
.page--chatty .plans__shot img{height:100%;object-fit:contain}
.page--chatty .plans>.price__card::after{background:var(--paper);background-clip:padding-box;box-shadow:inset 0 8px 0 var(--orange),inset 4px 4px 0 var(--emboss-hi),inset -4px -4px 0 var(--emboss-lo)}
.page--chatty .ask-wrap{max-width:1000px;display:grid;grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr);grid-template-areas:"photo heading" "photo form";gap:24px 48px;align-items:center}
.page--chatty .ask-wrap>.banner{grid-area:heading;margin:0;max-width:720px}
.page--chatty .ask__video{grid-area:photo;aspect-ratio:9/16;width:100%;max-width:min(340px,calc((100svh - 156px) * 9 / 16));margin:0;justify-self:center}
.page--chatty .ask__video video{object-fit:contain}
.page--chatty .ask{grid-area:form;padding:22px;min-width:0}
.page--chatty .ask__row{flex-wrap:wrap;gap:14px}
@media(min-width:1280px){
 .page--chatty .sec{padding-block:24px;scroll-margin-top:72px}
 .page--chatty .banner__title{font-size:32px}
 .page--chatty .banner__lede{font-size:14px;line-height:1.55}
 .page--chatty .tools{grid-template-columns:minmax(0,230px) minmax(0,1fr);gap:18px 26px}
 .page--chatty .tools__grid li{display:grid;grid-template-columns:1fr 1fr;gap:6px 12px;padding:12px}
 .page--chatty .tools__grid .shot{grid-column:1;grid-row:1/3;height:140px;aspect-ratio:auto;margin:0;align-self:center}
 .page--chatty .tools__grid b{grid-column:2;font-size:14px;align-self:end}
 .page--chatty .tools__grid span{grid-column:2;font-size:12px;align-self:start}
 .page--chatty .tools__reel{align-self:center;height:auto;max-height:calc(100svh - 280px)}
 .page--chatty .tools__reel video{object-fit:contain}
 .page--chatty .plans .price__list{font-size:14px;line-height:1.5}
}
@media(min-width:1280px) and (max-height:800px){
 .page--chatty .sec{padding-block:20px}
 .page--chatty .banner__title{font-size:28px}
 .page--chatty .banner__lede{font-size:13px}
 .page--chatty .plans .price__card{padding:16px}
 .page--chatty .plans .price__sum{font-size:42px}
 .page--chatty .plans .price__list li{padding-block:4px;font-size:13px}
 .page--chatty .version{padding:14px;gap:8px 14px}
 .page--chatty .version h3{font-size:20px}
 .page--chatty .tools__grid .shot{height:100px;aspect-ratio:auto}
 .page--chatty .why__band>img{max-height:280px}
 .page--chatty .tutor-intro>.banner{margin-bottom:22px}
 .page--chatty .tutor-intro__photo{width:100%;max-width:520px;justify-self:center}
 .page--chatty .tutor-cycle{padding:20px 24px}
 .page--chatty .tutor-intro__pilot{margin-top:22px}
}
@media(max-width:1000px){
 .page--chatty .phero__shot{max-width:330px}
 .page--chatty .versions{grid-template-columns:1fr}
 .page--chatty .why__band{grid-template-columns:1fr}
 .page--chatty .why__band::before,.page--chatty .why__band::after{display:none}
 .page--chatty .why__band .who__over{padding:0}
}
@media(max-width:640px){
 .page--chatty .ask-wrap{grid-template-columns:1fr;grid-template-areas:"heading" "photo" "form"}
 .page--chatty .ask__video{max-width:min(300px,calc((100svh - 160px) * 9 / 16))}
 .page--chatty .ask{padding:16px}
 .page--chatty .phero__shot{max-width:280px;justify-self:center}
 .page--chatty .version{grid-template-columns:1fr;padding:16px}
 .page--chatty .version__shot{grid-row:auto;grid-column:1;max-width:260px;justify-self:center}
 .page--chatty .version>:not(.version__shot){grid-column:1}
 .page--chatty .tools__grid .shot{height:auto;aspect-ratio:auto}
 .page--chatty .tools__grid .shot img{position:static;width:100%;height:auto;object-fit:contain}
}
.page--chatty .versions--three{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.page--chatty .versions--three .version{grid-template-columns:1fr;align-content:start;grid-template-rows:auto auto auto 1fr auto auto;gap:12px;padding:18px}
.page--chatty .versions--three .version__shot{grid-column:1;grid-row:1;height:auto!important;aspect-ratio:4/3;max-width:none;width:100%;margin:0}
.page--chatty #versions .version--promo .version__shot img{object-fit:cover;object-position:center}
.page--chatty .versions--three .version>:not(.version__shot){grid-column:1}
.page--chatty .versions--three .version h3{font-size:20px;min-height:2.4em;text-wrap:balance}
.page--chatty .version--robotics .tag{background:var(--navy-fill);color:var(--white)}
.page--chatty .versions--three .version__price{font-size:13px;line-height:1.5}
/* Reuse the home page's pixel-step entrance and floating CTA motion. */
.page--chatty #versions.is-in .version>.btn{animation:btn-in .55s steps(6,end) 1.25s backwards,btn-flick .35s steps(3,end) 1.8s backwards,btn-float 2.6s steps(2,end) 2.2s infinite}
.page--chatty #versions.is-in .version:nth-child(2)>.btn{animation-delay:1.43s,1.98s,1.5s}
.page--chatty #versions.is-in .version:nth-child(3)>.btn{animation-delay:1.61s,2.16s,.8s}
.page--chatty #versions.is-in .version>.btn:is(:hover,:focus-visible){animation-play-state:paused}
@media(prefers-reduced-motion:reduce){.page--chatty #versions.is-in .version>.btn{animation:none}}
.edu-overview-link{display:flex;align-items:center;justify-content:space-between;gap:24px;border-top:2px solid var(--outline-blue);padding-top:16px;margin-top:20px}
.edu-overview-link b{color:var(--navy)}
.edu-overview-link p{font-size:13px;line-height:1.5;max-width:75ch;margin:6px 0 0}
.edu-overview-link .btn{flex:none}
@media(min-width:1280px) and (max-height:800px){.page--chatty .versions--three .version{padding:12px;gap:8px}.page--chatty .versions--three .version h3{font-size:18px}.page--chatty .versions--three .version__list{font-size:12px}.page--chatty .edu-overview-link{margin-top:12px;padding-top:10px}}
@media(max-width:1000px){.page--chatty .versions--three{grid-template-columns:1fr}.edu-overview-link{align-items:start;flex-direction:column}}
/* Leave room for the EDU enquiry below the two existing tariffs on short screens. */
@media(min-width:1280px) and (max-height:800px){
 .page--chatty #versions{padding-block:8px}
 .page--chatty #versions .banner{margin-bottom:8px}
 .page--chatty #versions .banner__lede{max-width:none}
 .page--chatty #versions .version{gap:6px}
 .page--chatty #versions .tag{padding:4px 8px}
 .page--chatty #versions .version .btn{padding:8px 12px}
 .page--chatty #versions .version__list{line-height:1.45}
}
@media(min-width:1280px) and (max-height:800px){
 .page--chatty #price{padding-block:12px}
 .page--chatty #price .banner{margin-bottom:12px}
 .page--chatty #price .plans__shot{aspect-ratio:auto;max-height:none}
 .page--chatty #price .plans .price__card{padding:12px 16px}
 .page--chatty #price .plans .price__sum{margin-bottom:8px}
 .page--chatty #price .plans .price__list{margin-bottom:8px}
 .page--chatty #price .plans .price__list li{padding-block:3px;line-height:1.4}
 .page--chatty #price .plans .btn{padding-block:12px}
}