:root{--purple:#9b1fb5;--navy:#1d2655;--cream:#fbf6ea;--lime:#c8f21c;--orange:#ff7a45;--green:#3ddc97}
html{scroll-behavior:smooth}
body{font-family:'Nunito',sans-serif;background:var(--cream);color:var(--navy);overflow-x:hidden}
h1,h2,h3,h4,h5,h6{font-weight:800}
section{padding:70px 0;scroll-margin-top:20px}
.page-top{padding-top:110px}
/* header */
.site-header{position:fixed;top:16px;left:0;right:0;z-index:1050;padding:0 14px}
.pill-nav{max-width:1000px;margin:0 auto;background:rgba(255,255,255,.9);backdrop-filter:blur(10px);border-radius:18px;padding:10px 18px;box-shadow:0 6px 24px #0003}
.brand{font-weight:900;color:var(--purple);font-size:1.4rem;letter-spacing:-.5px;text-decoration:none}
.pill-nav .nav-link{color:var(--navy);font-weight:700;font-size:.85rem;padding:6px 11px}
.pill-nav .nav-link:hover,.pill-nav .nav-link.active{color:var(--purple)}
.btn-purple,.btn-orange{color:#fff;border-radius:10px;font-weight:700;padding:9px 20px;border:0}
.btn-purple{background:var(--purple)}.btn-purple:hover{background:#7d1693;color:#fff}
.btn-orange{background:var(--orange);padding:7px 16px;font-size:.85rem}.btn-orange:hover{background:#e8622c;color:#fff}
/* hero */
.hero{position:relative;min-height:680px;display:flex;align-items:flex-end;color:#fff;padding-bottom:130px;overflow:hidden}
.hero-bg{position:absolute;inset:0;background:linear-gradient(180deg,rgba(20,20,60,0) 25%,rgba(20,20,60,.7)),url(hero.jpg) center/cover,linear-gradient(135deg,#6d28d9,#db2777 60%,#f59e0b)}
.hero-inner{position:relative;z-index:2}
.hero h1{font-size:clamp(2.2rem,5vw,3.6rem);max-width:600px;line-height:1.1;margin-bottom:24px}
.float{position:absolute;font-size:5rem;opacity:.25;z-index:1}
.sticker{position:absolute;right:8%;bottom:70px;z-index:3;width:130px;height:130px;border-radius:50%;background:#fff;border:3px dashed #c9a8f0;color:var(--purple);display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;font-weight:900;line-height:1.1;transform:rotate(-8deg);box-shadow:0 6px 18px #0003}
.sticker small{font-size:.6rem;color:var(--navy);font-weight:700;margin-top:4px}
.torn{position:absolute;left:0;right:0;bottom:-1px;height:60px;z-index:2;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 60' preserveAspectRatio='none'%3E%3Cpath fill='%23fbf6ea' d='M0 30 L40 22 L80 34 L130 20 L190 36 L250 24 L310 38 L370 22 L430 34 L500 20 L560 36 L620 26 L690 38 L750 22 L820 34 L880 20 L950 36 L1010 24 L1080 38 L1140 22 L1210 34 L1280 20 L1350 34 L1440 24 V60 H0Z'/%3E%3C/svg%3E") bottom/100% 100% no-repeat}
.torn.navy{top:-1px;bottom:auto;transform:scaleY(-1)}
.sec-h{text-align:center;font-size:clamp(1.8rem,3.2vw,2.6rem);margin-bottom:36px}
/* course cards */
.ccard{border:2px solid;border-radius:20px;padding:10px;height:100%;display:flex;flex-direction:column;transition:.25s}
.ccard:hover{transform:translateY(-6px);box-shadow:0 12px 24px #0002}
.ccard .pic{height:180px;border-radius:14px;background-size:cover;background-position:center;display:flex;align-items:center;justify-content:center;font-size:4.5rem}
.ccard h5{margin:14px 6px 6px;font-size:1.05rem}.ccard p{font-size:.82rem;margin:0 6px 14px;color:#4b5280;flex:1}
.tags{display:flex;gap:8px;align-items:center;margin:0 6px 6px}
.tag{background:#fffa;border:1px solid #0002;border-radius:8px;font-size:.72rem;padding:3px 9px;font-weight:700}
.price{margin-left:auto;background:var(--navy);color:#fff;border-radius:8px;padding:4px 12px;font-weight:800;font-size:.85rem}
.c0{background:#d3e9fb;border-color:#9fcdf3}.c0 .pic{background-color:#b7dbf7}
.c1{background:#cdf6c9;border-color:#8fe58a}.c1 .pic{background-color:#a9eda4}
.c2{background:#fde0c4;border-color:#f7b985}.c2 .pic{background-color:#f9cb9f}
.c3{background:#ecd2fa;border-color:#cf9bef}.c3 .pic{background-color:#dcb1f5}
/* reviews */
.review{background:#ead3fa;border:2px solid var(--navy);border-radius:20px;padding:26px;box-shadow:7px 7px 0 -1px #f4e6fc,7px 7px 0 1px var(--navy),14px 14px 0 -1px #f4e6fc,14px 14px 0 1px var(--navy)}
.carousel-inner{padding:0 18px 18px 0}
.avatar{width:46px;height:46px;border-radius:50%;background:linear-gradient(135deg,var(--purple),var(--orange));color:#fff;display:inline-flex;align-items:center;justify-content:center;font-weight:800;flex-shrink:0}
.arrow{width:34px;height:34px;border-radius:50%;border:1.5px solid var(--navy);background:none;color:var(--navy)}
.arrow.on{background:var(--orange);border-color:var(--orange);color:#fff}
.progress-line{height:4px;background:#d9d3c2;border-radius:4px;overflow:hidden;max-width:300px}.progress-line div{height:100%;width:40%;background:var(--navy)}
/* collage */
.tile{border-radius:18px;display:flex;align-items:center;justify-content:center;font-size:4rem;min-height:170px}
.t1{background:linear-gradient(135deg,#bfe3ff,#8fc9f5)}.t2{background:linear-gradient(135deg,#ffd6e7,#f9a8d4);min-height:300px;font-size:6rem}.t3{background:linear-gradient(135deg,#d6ffc9,#9be58f);min-height:120px}
.mini{font-size:.78rem;color:#4b5280}
/* cards */
.soft{background:#fff;border:2px solid #ece4cf;border-radius:18px;padding:20px;height:100%;transition:.25s}
.soft:hover{border-color:var(--purple);transform:translateY(-4px)}
.date-badge{background:var(--purple);color:#fff;border-radius:12px;text-align:center;padding:6px 12px;font-weight:800;line-height:1.1;flex-shrink:0}
.date-badge.lime{background:var(--lime);color:var(--navy)}.date-badge small{display:block;font-size:.65rem;font-weight:700}
.t-avatar{width:96px;height:96px;font-size:2rem;margin:0 auto 12px}
.pill-chip{display:inline-block;background:#fff;border:2px solid #ece4cf;border-radius:30px;padding:5px 16px;font-weight:700;font-size:.85rem;margin:4px}
/* banner + cta + footer */
.banner{position:relative;height:420px;margin-top:40px;background:url(hero2.jpg) center/cover,linear-gradient(135deg,#f59e0b,#ef4444 50%,#9b1fb5)}
.banner .torn{bottom:auto;top:-1px;transform:scaleY(-1)}
.cta{position:relative;z-index:3;margin-top:-130px;background:var(--navy);color:#fff;border-radius:22px;padding:34px 40px;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:20px;max-width:900px}
.cta h3{max-width:330px;margin:0;font-size:1.4rem}
.circle{width:130px;height:130px;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;text-decoration:none;color:var(--navy);font-size:.75rem;font-weight:700;font-size:2.4rem}
.circle small{font-size:.72rem}.circle.g{background:var(--green)}.circle.l{background:var(--lime);margin-left:-40px}
footer.site-footer{padding:50px 0 24px}
.site-footer h6{font-size:.9rem}.site-footer a{display:block;color:#4b5280;text-decoration:none;font-size:.8rem;margin-bottom:7px}.site-footer a:hover{color:var(--purple)}
.site-footer .brand{font-size:1.5rem;display:inline-block}
@media(max-width:768px){.sticker{width:90px;height:90px;font-size:.8rem;right:4%}.circle.l{margin-left:0}.hero{min-height:560px}}