.t4s-home-why{width:100%;padding:0 16px;box-sizing:border-box;color:#222;}
.t4s-why-inner{display:flex;gap:40px;max-width:1440px;margin:0 auto;padding:70px 0;}
.t4s-why-left,.t4s-why-right{box-sizing:border-box;min-width:0;padding:10px;display:flex;flex-direction:column;}
.t4s-why-left{width:calc((100% - 40px)*.4);justify-content:center;gap:15px;}
.t4s-why-right{width:calc((100% - 40px)*.6);}
.t4s-why-heading{padding-bottom:10px;}
.t4s-home-why h2{margin:0;font:500 28px/1 Figtree,sans-serif;color:#222;}
.t4s-why-box{display:flex;flex-direction:column;justify-content:center;gap:10px;background:#faf9f6;border-radius:15px;padding:17px 20px 17px 23px;transition:box-shadow .3s;}
.t4s-why-box:hover,.t4s-why-box:focus-visible{box-shadow:0 0 20px rgba(0,0,0,.051);}
.t4s-why-box:focus-visible{outline:2px solid #344966;outline-offset:3px;}
.t4s-why-box h3{display:flex;align-items:center;margin:0;padding:0;color:#222;font:500 20px/1.5 Figtree,sans-serif;}
.t4s-why-box h3 svg{width:30px;height:30px;flex-shrink:0;display:block;}
.t4s-why-box h3 span{padding-left:5px;}
.t4s-why-description p{margin:0 0 14.4px;padding:0;color:#222;font:300 16px/1.2 Inter,Arial,sans-serif;}
.t4s-why-gallery{display:grid;overflow:hidden;touch-action:pan-y;}
.t4s-why-slide{grid-area:1/1;margin:0;padding:0;visibility:hidden;}
.t4s-why-slide.is-active{visibility:visible;}
.t4s-why-slide img{display:block;width:100%;height:auto;border-radius:20px;}
@media(max-width:1024px){.t4s-why-inner{flex-direction:column;gap:20px;padding-bottom:90px;max-width:1024px;}.t4s-why-left,.t4s-why-right{width:100%;}}
@media(max-width:767px){.t4s-why-inner{max-width:767px;}.t4s-why-left{gap:5px;}.t4s-home-why h2{font-size:24px;}.t4s-why-box h3{font-size:18px;}.t4s-why-description p{font-size:14px;}}
/* Classes page reuses the component with its source layout. */
.t4s-why-classes .t4s-why-inner{gap:20px}
.t4s-why-classes .t4s-why-right{align-self:center;justify-content:center}
.t4s-why-classes .t4s-why-description p{line-height:19.2px}
@media(max-width:1024px){.t4s-why-classes .t4s-why-inner{padding-bottom:90px}.t4s-why-classes .t4s-why-left{gap:5px}}
@media(max-width:767px){.t4s-why-classes .t4s-why-description p{line-height:16.8px}}
.t4s-why-classes .t4s-why-slide{line-height:24px}
.t4s-why-classes .t4s-why-slide img{display:inline}
@media(max-width:767px){.t4s-why-classes .t4s-why-slide{line-height:21px}}
/* About page shares content and interaction, preserving its source spacing. */
.t4s-why-about .t4s-why-inner{gap:20px}
.t4s-why-about .t4s-why-left{width:calc((100% - 40px)*.4)}
.t4s-why-about .t4s-why-right{width:calc((100% - 40px)*.6);gap:20px}
.t4s-why-about .t4s-why-description p{line-height:19.2px}
.t4s-why-about .t4s-why-slide{line-height:24px}
.t4s-why-about .t4s-why-slide img{display:inline}
@media(max-width:1024px){
 .t4s-why-about .t4s-why-inner{padding-bottom:70px}
 .t4s-why-about .t4s-why-left,.t4s-why-about .t4s-why-right{width:100%}
 .t4s-why-about .t4s-why-left{gap:5px}
}
@media(max-width:767px){
 .t4s-why-about .t4s-why-description p{line-height:16.8px}
 .t4s-why-about .t4s-why-slide{line-height:21px}
}
@media(max-width:1024px){.t4s-why-about .t4s-why-inner{gap:40px}}
/* Parents checklist uses the shared interaction, with source artwork sizes. */
.t4s-parents-prepare .t4s-why-inner{padding-top:0;gap:20px}
.t4s-parents-prepare h2{font-size:42px}
.t4s-parents-prepare .t4s-why-box h3 svg{margin-right:7.5px}
.t4s-parents-prepare .t4s-why-heading{padding-bottom:10px}
.t4s-parents-prepare .t4s-why-slide{text-align:center;line-height:24px}
.t4s-parents-prepare .t4s-why-slide img{display:inline;width:auto;max-width:100%}
@media(max-width:1024px){.t4s-parents-prepare .t4s-why-inner{gap:40px;padding-bottom:70px}.t4s-parents-prepare .t4s-why-left{gap:5px}}
@media(max-width:767px){.t4s-parents-prepare h2{font-size:21px}.t4s-parents-prepare .t4s-why-slide{line-height:21px}}
/* Schools: preserve alternate artwork and center every slide, not the tallest only. */
.t4s-why-schools .t4s-why-gallery{align-items:center}
.t4s-why-schools .t4s-why-right{justify-content:center}

/* Single kids lessons retain their own gallery spacing. */
.t4s-why-kids .t4s-why-gallery{align-items:center}
.t4s-why-kids .t4s-why-right{justify-content:center}
@media(max-width:1024px){.t4s-why-kids .t4s-why-inner{gap:20px}}
.t4s-why-kids .t4s-why-right{min-height:535px}
/* Retain the space formerly occupied by the mobile HTML control widget. */
@media(max-width:1024px){.t4s-why-kids .t4s-why-inner{padding-bottom:90px}}
