/* ===== Smart Learning · 4 pillars (Learning / Teaching / Development / Tutoring) ===== */
.hero{overflow:hidden!important}
/* nav: plain links, no dropdowns; short labels on desktop, full names in the mobile menu */
.menu .sp{display:none}
.menu>li>a{padding:10px 12px}
@media(max-width:860px){.menu .sp{display:inline}}
/* hero: 4 crystal buttons, one row */
.pillars.p4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;max-width:1144px;margin:0 0 30px}
.p4 .pb{padding:15px 16px;gap:12px;text-decoration:none}
.p4 .pb .pi{width:30px;height:30px;flex:none}
.p4 .pb .pt{min-width:0}
.p4 .pb .pt b{font-size:18.5px;white-space:nowrap;letter-spacing:-.2px}
.p4 .pb .pt small{font-size:12px;white-space:normal;line-height:1.32;margin-top:3px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.p4 .pb{align-items:center}.p4 .pb .pt small{text-wrap:balance}
.p4 .pb .arw{width:16px;height:16px;flex:none;margin-left:auto;opacity:.65;transition:transform .3s,opacity .3s}
.p4 .pb:hover .arw,.p4 .pb:focus-visible .arw{transform:translateY(3px);opacity:1}
.p4 .pb:nth-child(2){animation-duration:5.8s;animation-delay:-1.6s}.p4 .pb:nth-child(3){animation-duration:5.5s;animation-delay:-3s}.p4 .pb:nth-child(4){animation-duration:6.4s;animation-delay:-4.2s}
@media(max-width:1180px){.p4 .pb{padding:14px 12px;gap:10px}.p4 .pb .pt b{font-size:17px}.p4 .pb .pt small{font-size:11.5px}}
@media(max-width:1000px){.pillars.p4{grid-template-columns:repeat(2,minmax(0,1fr));max-width:640px}}
@media(max-width:700px){.pillars.p4{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;max-width:none}
 .p4 .pb{flex-direction:column;align-items:flex-start;gap:8px;padding:13px 13px 12px;position:relative}
 .p4 .pb .pi{width:24px;height:24px}.p4 .pb .pt b{font-size:15.5px}.p4 .pb .pt small{font-size:11px;white-space:normal;line-height:1.3}
 .p4 .pb .arw{position:absolute;top:14px;right:12px}}
/* ===== parallax pillar sections ===== */
.pz{position:relative;overflow:hidden;isolation:isolate;color:#fff;padding:130px 0;background:#0b1026}
.pz .pzbg{position:absolute;left:0;right:0;top:-16%;bottom:-16%;background-size:cover;background-position:center;z-index:-2;will-change:transform;transform:translate3d(0,0,0)}
.pz::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
 background:linear-gradient(90deg,rgba(7,10,28,.9) 0%,rgba(7,10,28,.72) 42%,rgba(7,10,28,.42) 100%),linear-gradient(180deg,rgba(7,10,28,.5) 0%,rgba(7,10,28,.12) 38%,rgba(7,10,28,.55) 100%)}
.pz-learning::after{background:linear-gradient(90deg,rgba(6,18,40,.9),rgba(8,26,56,.7) 45%,rgba(12,40,80,.38)),linear-gradient(180deg,rgba(6,12,30,.5),rgba(6,12,30,.1) 40%,rgba(6,12,30,.6))}
.pz-teaching::after{background:linear-gradient(90deg,rgba(16,10,40,.9),rgba(30,16,70,.7) 45%,rgba(40,20,90,.4)),linear-gradient(180deg,rgba(10,8,30,.5),rgba(10,8,30,.12) 40%,rgba(10,8,30,.6))}
.pz-development::after{background:linear-gradient(90deg,rgba(8,10,30,.9),rgba(14,18,48,.6) 45%,rgba(20,24,60,.22)),linear-gradient(180deg,rgba(6,8,24,.5),rgba(6,8,24,.02) 40%,rgba(6,8,24,.6))}
.pz-tutoring::after{background:linear-gradient(90deg,rgba(8,14,34,.92),rgba(10,18,44,.66) 48%,rgba(14,24,56,.3)),linear-gradient(180deg,rgba(6,10,26,.5),rgba(6,10,26,.04) 40%,rgba(6,10,26,.62))}
.pz .anc{position:absolute;top:0}
.pz .k{color:#67e8f9;letter-spacing:.22em}
.pz h2{font-size:clamp(40px,5.4vw,68px);letter-spacing:-2px;max-width:none;margin:10px 0 18px;text-shadow:0 2px 30px rgba(0,0,0,.35)}
.pz .gt{background:linear-gradient(90deg,#67e8f9,#a78bfa 55%,#f0abfc);-webkit-background-clip:text;background-clip:text;color:transparent}
.pz .lead{color:#dbe4f3;max-width:700px;text-shadow:0 1px 12px rgba(0,0,0,.4)}
.pz .hd{margin-bottom:48px}
/* floating glass / crystal cards */
.gg{display:grid;gap:22px}.g3{grid-template-columns:repeat(3,1fr)}.g4{grid-template-columns:repeat(4,1fr)}.g5{grid-template-columns:repeat(5,1fr);gap:16px}
.gc{--c:#67e8f9;position:relative;border-radius:22px;padding:28px 26px;color:#fff;overflow:hidden;
 background:linear-gradient(155deg,rgba(255,255,255,.17),rgba(255,255,255,.05) 55%,rgba(255,255,255,.08)),rgba(12,16,40,.38);
 -webkit-backdrop-filter:blur(18px) saturate(160%);backdrop-filter:blur(18px) saturate(160%);
 border:1px solid rgba(255,255,255,.2);
 box-shadow:inset 0 1px 0 rgba(255,255,255,.4),inset 0 -1px 0 rgba(255,255,255,.06),0 24px 50px -22px rgba(0,0,0,.65),0 0 0 1px rgba(255,255,255,.02);
 animation:gcFloat 7s ease-in-out infinite;transition:box-shadow .35s,border-color .35s,translate .35s}
.gc::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(120deg,rgba(255,255,255,.22),transparent 30%,transparent 70%,color-mix(in srgb,var(--c) 30%,transparent));opacity:.55}
.gc::after{content:"";position:absolute;left:18px;right:18px;top:0;height:2px;border-radius:2px;background:linear-gradient(90deg,transparent,var(--c),transparent);opacity:.9}
.gg>.gc:nth-child(2){animation-delay:-1.4s;animation-duration:7.6s}.gg>.gc:nth-child(3){animation-delay:-2.8s;animation-duration:6.6s}.gg>.gc:nth-child(4){animation-delay:-4.1s;animation-duration:7.9s}.gg>.gc:nth-child(5){animation-delay:-5.3s;animation-duration:7.2s}
.gc:hover{translate:0 -6px;border-color:color-mix(in srgb,var(--c) 60%,rgba(255,255,255,.3));box-shadow:inset 0 1px 0 rgba(255,255,255,.5),0 30px 60px -22px rgba(0,0,0,.7),0 0 36px -6px color-mix(in srgb,var(--c) 55%,transparent)}
@keyframes gcFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
.gc>*{position:relative}
.gc h3{font-size:23px;font-weight:800;margin:6px 0 8px;letter-spacing:-.3px}
.gc p{color:#d3dcec;font-size:15px;line-height:1.55}
.gc .pill{display:inline-block;font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:6px 11px;border-radius:999px;color:#fff;background:color-mix(in srgb,var(--c) 26%,rgba(255,255,255,.06));border:1px solid color-mix(in srgb,var(--c) 50%,transparent)}
.gc ul{list-style:none;margin-top:14px}
.gc li{padding:9px 0 9px 24px;position:relative;color:#e6ecf7;font-size:14.5px;border-top:1px solid rgba(255,255,255,.1)}
.gc li::before{content:"";position:absolute;left:0;top:15px;width:9px;height:9px;border-radius:3px;background:var(--c);box-shadow:0 0 10px var(--c)}
.gm{padding:24px 20px}.gm h3{font-size:19px}.gm p{font-size:14px}
.gm .who{font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:#a5f3fc}
.gd .ico{width:52px;height:52px;border-radius:14px;display:grid;place-items:center;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.18);margin-bottom:12px}
.gd .ico svg{width:30px;height:30px}
.gd h3{font-size:19px}
.pzx{margin-top:30px;color:#cbd5e1}.pzx a{color:#a5f3fc;font-weight:700}
.pzcta{margin-top:34px;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:22px 26px;border-radius:20px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}
.pzcta p{color:#dbe4f3;max-width:760px}.pzcta b{color:#fff}.pzcta .btn{margin:0;flex:none}
/* tutoring */
.tsplit{display:grid;grid-template-columns:1fr 1.08fr;gap:56px;align-items:start}
.steps{list-style:none;counter-reset:s;margin:30px 0 26px;display:grid;gap:14px}
.steps li{counter-increment:s;position:relative;padding:14px 16px 14px 62px;border-radius:16px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
.steps li::before{content:counter(s);position:absolute;left:16px;top:50%;translate:0 -50%;width:32px;height:32px;border-radius:10px;display:grid;place-items:center;font-weight:800;background:linear-gradient(135deg,#22d3ee,#7c3aed);box-shadow:0 0 18px rgba(34,211,238,.45)}
.steps b{display:block;font-size:16px}.steps span{color:#cbd5e1;font-size:14px}
.soon{display:flex;gap:10px;align-items:flex-start;color:#cbd5e1;font-size:14px;font-style:italic;opacity:.9}
.soon i{flex:none;width:8px;height:8px;margin-top:7px;border-radius:50%;background:#f0abfc;box-shadow:0 0 10px #f0abfc}
.tf{background:linear-gradient(155deg,rgba(255,255,255,.16),rgba(255,255,255,.06)),rgba(10,14,36,.45);-webkit-backdrop-filter:blur(20px) saturate(150%);backdrop-filter:blur(20px) saturate(150%);border:1px solid rgba(255,255,255,.22);box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 30px 70px -26px rgba(0,0,0,.75);gap:13px}
.tfh{display:grid;gap:2px;margin-bottom:4px}.tfh b{font-size:20px}.tfh span{font-size:13px;color:#a5f3fc}
.tf .r2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.tf .hdl[hidden],.tf .so[hidden]{display:none}
.tf textarea{min-height:0}
.fmt{border:0;padding:0;margin:0;display:grid;gap:6px;min-width:0}
.fmt legend{font-size:13px;font-weight:700;color:#e0e7ff;margin-bottom:6px;padding:0}
.fmt{grid-template-columns:repeat(3,1fr)}
.fmt label{display:block;font-weight:600}.fmt input{position:absolute;opacity:0;pointer-events:none}
.fmt span{display:block;text-align:center;padding:12px 6px;border-radius:12px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.22);color:#e2e8f0;font-size:14px;cursor:pointer;transition:.2s}
.fmt input:checked+span{background:linear-gradient(135deg,rgba(34,211,238,.35),rgba(124,58,237,.45));border-color:#67e8f9;color:#fff;box-shadow:0 0 16px rgba(34,211,238,.35)}
.fmt input:focus-visible+span{outline:2px solid #a78bfa;outline-offset:2px}
.tf .cfmsg{color:#fecaca;font-size:14px;min-height:1em}
.tfok{padding:48px 32px;border-radius:24px;text-align:center;background:linear-gradient(155deg,rgba(255,255,255,.16),rgba(255,255,255,.06)),rgba(10,14,36,.5);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.22)}
.tfok h3{font-size:28px;margin:12px 0 10px}.tfok p{color:#dbe4f3}
@media(max-width:1100px){.g5{grid-template-columns:repeat(3,1fr)}.g4{grid-template-columns:repeat(2,1fr)}.tsplit{grid-template-columns:1fr;gap:34px}}
@media(max-width:860px){.g3{grid-template-columns:1fr}.pz{padding:90px 0}.pzcta{flex-direction:column;align-items:flex-start}}
@media(max-width:600px){.g5,.g4{grid-template-columns:1fr}.tf .r2{grid-template-columns:1fr}.pz h2{font-size:40px;letter-spacing:-1.2px}.gc{padding:24px 20px}
 .gc{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}}
@media(prefers-reduced-motion:reduce){.gc,.p4 .pb{animation:none}.pz .pzbg{transform:none!important}}

/* ===== section eyebrow name + tiny SL mark (back to top) ===== */
.pz .kx{display:flex;align-items:center;gap:10px}
.sltop{display:inline-grid;place-items:center;width:20px;height:20px;line-height:0;opacity:.9;transition:opacity .3s,filter .3s,transform .3s cubic-bezier(.2,.7,.2,1);filter:drop-shadow(0 0 4px rgba(124,58,237,.45))}
.sltop svg{width:20px;height:20px;overflow:visible}
.sltop .tb rect{transform-box:fill-box;transform-origin:center;transition:transform .45s cubic-bezier(.2,.7,.2,1),opacity .45s}
.sltop:hover,.sltop:focus-visible{opacity:1;transform:translateY(-1px);filter:drop-shadow(0 0 7px rgba(34,211,238,.7))}
.sltop:hover .tb rect,.sltop:focus-visible .tb rect{transform:translate(var(--dx),var(--dy)) scale(.8);opacity:.75}
.sltop:focus-visible{outline:2px solid #a78bfa;outline-offset:4px;border-radius:4px}
@media(prefers-reduced-motion:reduce){.sltop,.sltop .tb rect{transition:none}}
